首页 > 代码库 > 添加图片的两种方式
添加图片的两种方式
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>js练习 js是脚本语言直接运行在浏览器上的。</title> <script type="text/javascript"> function addcontent(){ document.getElementById("span01").innerHTML="<img src=http://www.mamicode.com/‘pic/star-off.png‘>"; } </script> </head> <body> <span id="span01"> </span> <input type="button" value="http://www.mamicode.com/增加图片" onclick="addcontent();"> </body> </html>
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>js练习 js是脚本语言直接运行在浏览器上的。</title> <script type="text/javascript"> function addpic(){ //第一步创建一个dom元素 var imgdom=document.createElement("img"); //第二步引用方法 imgdom.setAttribute("src","pic/star-on.png"); //把元素节点的值给她 document.getElementById("div1").appendChild(imgdom); } </script> </head> <body> <div id="div1"> </div> <input type="button" value="http://www.mamicode.com/添加" onclick="addpic()"> </body> </html>
总结:第一种方式添加只能添加一张图片,第二种可以添加很多张图片(先创建dom元素,然后给dom元素赋值,最后添加dom元素到div中去)。
添加图片的两种方式
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。