document对象中的两个属性innerHTML、innerText的作用
（1）获取对象的值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>innerHTML</title>
</head>
<body>
<p id="p1">AAA</p>
<div id='div1'>
<p id="p2">BBB</p>
</div>
<script>
console.log(document.getElementById("p1"));
console.log(document.getElementById("p1").innerHTML);
console.log(document.getElementById("p1").innerText);
console.log(document.getElementById("div1"));
console.log(document.getElementById("div1").innerHTML);
console.log(document.getElementById("div1").innerText);
</script>
</body>
</html>控制台输出结果：
document对象中有innerHTML、innerText这两个属性，都是获取document对象文本内容，但使用起来还是有区别的；
1） innerHTML设置或获取标签所包含的HTML+文本信息(从标签起始位置到终止位置全部内容，包括HTML标签，但不包括自身)
2） outerHTML设置或获取标签自身及其所包含的HTML+文本信息（包括自身）
3） innerText设置或获取标签所包含的文本信息（从标签起始位置到终止位置的内容，去除HTML标签，但不包括自身）
4） outerText设置或获取标签自身及其所包含的文本信息（包括自身）
（2）改变对象的值
document.getElementById("p1").innerHTML = "AAA-111";
document.getElementById("p2").innerText = "BBB-222";
扫一扫
1164
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
