Javascript僅在chrome中工作，但沒有其他瀏覽器

Question

我試圖通過頁面加載javascript在后台填充圖像。 我嘗試使用以下代碼片段 - 我嘗試在本地Chrome以及localhost上運行它，它運行正常但在Firefox，Safari和所有其他瀏覽器中圖像都沒有顯示。

var body = document.body,
    html = document.documentElement;

var height = Math.floor(Math.min(body.scrollHeight));
for(i=0; i<height; i++){
  var images = [],
  index = 0;
  images[0] = "<img id='rel' src='http://ia.media-imdb.com/images/M/MV5BMTU4MDU3NDQ5Ml5BMl5BanBnXkFtZTgwOTU5MDUxNTE@._V1_SX300.jpg'>";

  images[1] = "<img id='rel1' src='http://ia.media-imdb.com/images/M/MV5BMTk2NTI1MTU4N15BMl5BanBnXkFtZTcwODg0OTY0Nw@@._V1_SX300.jpg'>";

  images[2] = "<img id='rel2' src='http://ia.media-imdb.com/images/M/MV5BODU4MjU4NjIwNl5BMl5BanBnXkFtZTgwMDU2MjEyMDE@._V1_SX300.jpg'>";

  images[3] = "<img id='rel' src='http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg'>";

  images[4] = "<img id='rel1' src='http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg'>";

  images[5] = "<img id='rel2' src='http://ia.media-imdb.com/images/M/MV5BMTk4ODQzNDY3Ml5BMl5BanBnXkFtZTcwODA0NTM4Nw@@._V1_SX300.jpg'>";

  images[6] = "<img id='rel' src='http://ia.media-imdb.com/images/M/MV5BMjU4NDExNDM1NF5BMl5BanBnXkFtZTgwMDIyMTgxNzE@._V1_SX300.jpg'>";

  images[7] = "<img id='rel1' src='http://ia.media-imdb.com/images/M/MV5BOTAzODEzNDAzMl5BMl5BanBnXkFtZTgwMDU1MTgzNzE@._V1_SX300.jpg'>";

  images[8] = "<img id='rel2' src='http://ia.media-imdb.com/images/M/MV5BMTc2MTQ3MDA1Nl5BMl5BanBnXkFtZTgwODA3OTI4NjE@._V1_SX300.jpg'>";

  images[9] = "<img id='rel' src='http://ia.media-imdb.com/images/M/MV5BMTAzZmJiOGQtOWM3NS00MDEwLWJiNGEtN2QzMDM3NDJjMWQwXkEyXkFqcGdeQXVyNDUzOTQ5MjY@._V1_SX300.jpg'>";

  images[10] = "<img id='rel1' src='http://ia.media-imdb.com/images/M/MV5BMTUyMTE0ODcxNF5BMl5BanBnXkFtZTgwODE4NDQzNTE@._V1_SX300.jpg'>";

  images[11] = "<img id='rel2' src='http://ia.media-imdb.com/images/M/MV5BMjM2Nzg4MzkwOF5BMl5BanBnXkFtZTgwNzA0OTE3NjE@._V1_SX300.jpg'>";

  images[12] = "<img id='rel' src='http://ia.media-imdb.com/images/M/MV5BMjEyMjcyNDI4MF5BMl5BanBnXkFtZTcwMDA5Mzg3OA@@._V1_SX300.jpg'>";

  images[13] = "<img id='rel1' src='http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg'>";

  images[14] = "<img id='rel2' src='http://ia.media-imdb.com/images/M/MV5BMjIxMjgxNTk0MF5BMl5BanBnXkFtZTgwNjIyOTg2MDE@._V1_SX300.jpg'>";

  index = Math.round(Math.random() * images.length);

  document.write(images[index]);
}

和HTML：

<body>
  <div id="continer">
    <script type="text/javascript" src="images.js"></script>
  </div>

Answer 1

在Firefox和其他一些瀏覽器中，滾動條沒有附加到正文，而是附加到documentElement即<html>標記。

你必須檢查哪一個實際上有scrollHeight

var body = document.body,
    html = document.documentElement;

var bodyHeight = Math.floor(Math.min(body.scrollHeight));
var htmlHeight = Math.floor(Math.min(html.scrollHeight));

var height = Math.max(bodyHeight, htmlHeight);

for(i=0; i<height; i++){ ...

Answer 2

因為您的代碼是指頁面的正文和可視元素，所以您需要在加載頁面后執行腳本。 我修改了你的代碼，它現在可以在Chrome，IE和FF中使用。

最關鍵的變化是從onLoad（）事件運行腳本。

<body  onload="showImages();">

注意為了簡潔，我在這里刪除了很多圖像數組插入。

<html>
<head>
</head>
<script>
function showImages() {
var body = document.body,
    html = document.documentElement;

var height = Math.floor(Math.min(body.scrollHeight));
for(i=0; i<height; i++){
var images = [],
index = 0;
images[0] = "<img id='rel' src='http://ia.media-imdb.com/images/M/MV5BMTU4MDU3NDQ5Ml5BMl5BanBnXkFtZTgwOTU5MDUxNTE@._V1_SX300.jpg'>";

images[1] = "<img id='rel1' src='http://ia.media-imdb.com/images/M/MV5BMTk2NTI1MTU4N15BMl5BanBnXkFtZTcwODg0OTY0Nw@@._V1_SX300.jpg'>";

//  ...

index = Math.round(Math.random() * images.length);

document.write(images[index]);

}
}
</script>
 <body  onload="showImages();">
<div id="continer">``

</div>

Javascript僅在chrome中工作，但沒有其他瀏覽器

問題描述

2 個解決方案

解決方案1
0 已采納 2016-11-06 20:56:05

解決方案2
0 2016-11-06 21:05:53

Javascript僅在chrome中工作，但沒有其他瀏覽器

問題描述

2 個解決方案

解決方案1 0 已采納 2016-11-06 20:56:05

解決方案2 0 2016-11-06 21:05:53

解決方案1
0 已采納 2016-11-06 20:56:05

解決方案2
0 2016-11-06 21:05:53