HTML DOM innerHTML 属性
JavaScript基础 2022-06-08 11:29:24小码哥的IT人生shichen
HTML DOM innerHTML 属性
定义和用法
innerHTML 属性设置或返回元素的 inner HTML。
语法
HTMLElementObject.innerHTML=text
浏览器支持
IE | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|
所有主流浏览器均支持 innerHTML 属性。
实例
改变链接的文本、URL 和 target:
<html>
<head>
<script>
function changeLink()
{
document.getElementById('myAnchor').innerHTML="phpcodewebs";
document.getElementById('myAnchor').href="http://www.www.phpcodeweb.com";
document.getElementById('myAnchor').target="_blank";
}
</script>
</head>
<body>
<a id="myAnchor" href="http://www.microsoft.com">Microsoft</a>
<input type="button" onclick="changeLink()" value="Change link">
</body>
</html>
完整实例:
<!DOCTYPE html>
<html>
<head>
<script>
function changeLink()
{
document.getElementById('myAnchor').innerHTML="phpcodeweb";
document.getElementById('myAnchor').href="http://www.phpcodeweb.com";
document.getElementById('myAnchor').target="_blank";
}
</script>
</head>
<body>
<a id="myAnchor" href="http://www.microsoft.com">微软</a>
<input type="button" onclick="changeLink()" value="更改链接">
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html