定义和用法
innerHTML 属性用于设置或返回指定标签之间的 HTML 内容。
语法
Object.innerHTML = "HTML";// 设置 var html = Object.innerHTML;// 获取
例子 1
获取段落p的 innerHTML(html内容)
<html> <head> <script type="text/javascript"> function getInnerHTML(){ alert(document.getElementById("test").innerHTML); } </script> </head><body> <p id="test"><font color="#000">嗨豆壳 www.hi-docs.com</font></p> <input type="button" onclick="getInnerHTML()" value="点击" /> </body> </html>
例子 2
设置段落p的 innerHTML(html内容)
<html> <head> <script type="text/javascript"> function setInnerHTML(){ document.getElementById("test").innerHTML = "<strong>设置标签的html内容</strong>"; } </script> </head><body> <p id="test"><font color="#000">嗨豆壳 www.hi-docs.com</font></p> <input type="button" onclick="setInnerHTML()" value="点击" /> </body> </html>
例子3 :document.body.innerHTML
<htmL> <head> <meta content="text/html;charset=utf-8" http-equiv="content-type"> <script type="text/javascript"> window.onload = function(){ var arrLi = {我的朋友:['哇哈哈','乐百氏','农夫山泉'],同学:['咖啡','果汁','果酒']}; var n = -1 for(var i in arrLi){ n++; document.body.innerHTML += '<ul>'+i+'</ul>'; var ul = document.getElementsByTagName('ul'); for (var j = 0; j < arrLi[i].length; j++) { ul[n].innerHTML += '<li>'+arrLi[i][j]+'</li>'; }; } } </script> </head> <body> </body> </htmL>