使用javascript将img元素添加到div
我正在尝试使用JavaScript将img添加到placehere
div,但是我没有运气。 任何人都可以用我的代码给我一个手吗?
<html> <script type="text/javascript"> var elem = document.createElement("img"); elem.setAttribute("src", "images/hydrangeas.jpg"); elem.setAttribute("height", "768"); elem.setAttribute("width", "1024"); elem.setAttribute("alt", "Flower"); document.getElementById("placehere").appendChild("elem"); </script> <body> <div id="placehere"> </div> </body> </html>
document.getElementById("placehere").appendChild(elem);
不
document.getElementById("placehere").appendChild("elem");
并使用下面的设置来源
elem.src = 'images/hydrangeas.jpg';
它应该是:
document.getElementById("placehere").appendChild(elem);
并把你的div放在你的javascript之前,因为如果你不这样做,那么javascript在div存在之前执行。 或等待它加载。 所以你的代码如下所示:
<html> <body> <script type="text/javascript"> window.onload=function(){ var elem = document.createElement("img"); elem.setAttribute("src", "http://img.zohostatic.com/discussions/v1http://img.dovov.comdefaultPhoto.png"); elem.setAttribute("height", "768"); elem.setAttribute("width", "1024"); elem.setAttribute("alt", "Flower"); document.getElementById("placehere").appendChild(elem); } </script> <div id="placehere"> </div> </body> </html>
为了certificate我的观点,请参阅onload和this on onload 。 启动控制台,你会发现一个错误,说明该div不存在或无法findnull的appendChild方法。
function image() { //dynamically add an image and set its attribute var img=document.createElement("img"); img.src="p1.jpg" img.id="picture" var foo = document.getElementById("fooBar"); foo.appendChild(img); } <span id="fooBar"> </span>