Question

我在尝试将字符串变量的值写入DOM中的特定元素到特定div时遇到问题。

让我们说游戏= TEN

document.getElementById("game").innerHTML=game;

不写信给：

<div id="game"></div>

问题在于下面的代码我有一个脚本，在该脚本的最后我可以document.write（游戏），它工作正常，但我不能写它到div？也许我试图做错了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>
<body>
<!--<form id="teamSelect"onsubmit="return function games();"><select>
    <option value="TEN">Tennessee</option>
    <option value="GB">Green Bay</option>
    </select>
    <input type="submit" name="Submit" />
    </form>
-->

<script>
var jsonString = '{"ss":[["Thu","7:30","Pregame",,"JAC",,"NE",,,,"55425",,"PRE1","2011"],' +
    '["Thu","7:30","Pregame",,"BAL",,"PHI",,,,"55424",,"PRE1","2011"],' +
    '["Thu","8:00","Pregame",,"SEA",,"SD",,,,"55423",,"PRE1","2011"],' +
    '["Thu","8:30","Pregame",,"DEN",,"DAL",,,,"55426",,"PRE1","2011"],' +
    '["Thu","10:00","Pregame",,"ARI",,"OAK",,,,"55427",,"PRE1","2011"],' +
    '["Fri","7:30","Pregame",,"MIA",,"ATL",,,,"55430",,"PRE1","2011"],' +
    '["Fri","7:30","Pregame",,"CIN",,"DET",,,,"55429",,"PRE1","2011"],' +
    '["Fri","7:30","Pregame",,"PIT",,"WAS",,,,"55431",,"PRE1","2011"],' +
    '["Fri","8:00","Pregame",,"TB",,"KC",,,,"55428",,"PRE1","2011"],' +
    '["Fri","8:00","Pregame",,"SF",,"NO",,,,"55432",,"PRE1","2011"],' +
    '["Sat","7:30","Pregame",,"GB",,"CLE",,,,"55433",,"PRE1","2011"],' +
    '["Sat","8:00","Pregame",,"NYG",,"CAR",,,,"55437",,"PRE1","2011"],' +
    '["Sat","8:00","Pregame",,"BUF",,"CHI",,,,"55434",,"PRE1","2011"],' +
    '["Sat","8:00","Pregame",,"IND",,"STL",,,,"55435",,"PRE1","2011"],' +
    '["Sat","8:00","Pregame",,"MIN",,"TEN",,,,"55436",,"PRE1","2011"],' +
    '["Mon","8:00","Pregame",,"NYJ",,"HOU",,,,"55438",,"PRE1","2011"]]}';

//var jsonString = '{"test": "test1"}';    

for (i=0; i<15;i++) {
    if ("TEN" == eval('(' + jsonString + ')').ss[i][6] || "TEN" == eval('(' + jsonString + ')').ss[i][4]) {
    var game=(eval('('+jsonString+')').ss[i][6] + ' vs ' + eval('('+jsonString+')').ss[i][4]);
    var day=(eval('('+jsonString+')').ss[i][0] + ' at ' + eval('('+jsonString+')').ss[i][1]);
    }
}
document.write(game);
document.getElementById("game").innerHTML=game;
</script>

<div id="game" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:16px">hello</divЮ
</body>
</html>

Answer 1

当你执行脚本并且你正在寻找元素时，它还不存在，因为它会在以后出现。

确切地说，它尚未被解析并添加到DOM中。

所以将脚本移动到HTML文件的底部（至少在元素下面）。

如果您正在使用某种类型的库，它也可以轻松解决：例如，对于jQuery，将所有内容放在$(function() { ... }块中。这样，直到DOM完全加载它才会被执行（此时你可以安全地搜索元素）。

Answer 2

当您尝试访问#game元素时，它尚未创建。您应该等待onload事件并将函数绑定到此事件：

<script type="text/javascript">
function init() {
   /**your code here**/
}
</script>

<body onload="init()">
<div id="game"></div>
</body></html>

Answer 3

Init（）函数不起作用，因为DOM没有完全加载。要么自己使用jquery或dojo并使用文档就绪函数，要么将javascript块放在html文档的末尾，也就是关闭正文标记之前。

获取自己的Firebug，并在开头重写这样的代码：

<html>
<body>
<div id="myid"></div>
</body>
<script language="Javascript">
document.getElementByID('myid').innerHTML = ....
</html>

驯

Answer 4

或者您可以使用jqueries

$(document).ready(function(){});

document.getElementById（“xxxxx”）。innerHTML根本不起作用？

4 个答案: