HTML DOM innerHTML 属性
元素对象定义和用法
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
语法
HTMLElementObject.innerHTML=text
浏览器支持
所有主要浏览器都支持 innerHTML 属性
实例
实例
改变文本, URL, 及链接目标:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>高手教程(study.p2hp.com)</title>
<script>
function changeLink(){
document.getElementById('myAnchor').innerHTML="P2HP";
document.getElementById('myAnchor').href="//study.p2hp.com";
document.getElementById('myAnchor').target="_blank";
}
</script>
</head>
<body>
<a id="myAnchor" href="//www.microsoft.com">Microsoft</a>
<input type="button" onclick="changeLink()" value="修改链接">
</body>
</html>
尝试一下 »
dg
ive***foxmail.com
使用 innerHTML 时若与 createElement 同级并且 innerHTML 在后会出现事件无法绑定，原因是 innerHTML 后父级 DOM 重新加载。例如：
/*有问题的情况*/ function c(){ var a = document.createElement("div"); var a1 = document.createElement("div"); a1.innerText = "点我不会执行onclick"; a1.onclick = function(){alert(1)}; a.appendChild(a1); a.innerHTML += "<b></b>"; document.getElementsByTagName("body")[0].appendChild(a); } /*没问题的情况*/ function c(){ var a = document.createElement("div"); a.innerHTML += "<b></b>"; var a1 = document.createElement("div"); a1.innerText = "点我会执行onclick"; a1.onclick = function(){alert(1)}; a.appendChild(a1); document.getElementsByTagName("body")[0].appendChild(a); }dg
ive***foxmail.com