innerHTML和innerText的区别
两者的主要区别在于用法不同;
innerHTML可以将获取的元素作为HTML元素进行解析或修改,
innerText可以将获取的元素作为纯文本进行解析或修改。
innerHTML和innerText的具体用法:
<!DOCTYPE html>
<html>
<head>
<meta charset="asmo-708">
<title></title>
</head>
<body>
<div id="kuai">
<p>这是被div和p包裹的文本</p>
</div>
<input type="button" value="innerHTML" onclick="HTML()" />
<input type="button" value="innerText" onclick="Text()" />
</body>
<script type="text/javascript">
function HTML() {
var kuai = document.getElementById("kuai")//获取div标签
console.log(kuai.innerHTML)//控制台输出div里的HTML内容
}
function Text() {
var kuai = document.getElementById("kuai")//获取div标签
console.log(kuai.innerText)//控制台输出div里的文本内容
}
</script>
</html>
这个是网页显示效果:
分别点击按钮后控制台显示:
进行对比后发现,innerHTML会将标签和文本同时进行解析,而innerText只会将文本进行解析。
本文地址:https://blog.csdn.net/qq_43445758/article/details/111104278