您好，这是我的简单代码。我想在元素 main_container 中显示在 function add(src){} 中创建的图像。为什么它不起作用？
<head>
</head>
<body>
<style>
#main_container
{
width:1000px;
height:1000px;
position:absolute;
border-style:solid;
}
.jersey
{
width:100px;
height:150px;
position:absolute;
}
</style>
<script>
var dist=-110;
function add(src)
{
dist=dist+110;
var img=document.createElement("img");
img.src=src;
img.style.left=dist+"px";
img.className="jersey";
document.getElementById("main_container").appendChild(img);
}
add("http://www.hdwallpapers.in/walls/abstract_color_background_picture_8016-wide.jpg");
</script>
<div id="main_container"></div>
</body>
</html>
最佳答案
将脚本标记移动到元素下方。
更改:
<script>...</script>
<div id="main_container"></div>
致:
<div id="main_container"></div>
<script>...</script>
浏览器从上到下读取 HTML。
关于Javascript-创建元素作为另一个元素的子元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23411020/