【JS】innerHTML和innerText

innerHTML

• 会被浏览器解析

1.获取

• 返回字符串
• 可以获取指定标签里面的所有内容
  • 代码中被获取的对象是什么样子就会输出什么样子（输出包含空白文本节点

<div id="clickon"><label style="font-size: 10px;">考号</label><br>
        <label>考号</label></div>
<!--会输出:
<label style="font-size: 10px;">考号</label><br>
        <label>考号</label>
-->

2.赋值

(1) =，直接覆盖所有内容

(2) +=，增加（尾

(3) =?+本身，添加（首

innerText

• 同上，但会被当作文本，不会被浏览器解析
• 且只会获取其中的文本
  • 获取的文本格式与浏览器显示的格式一致

        考号        
        考号    

<div id="clickon">
        <label>考号</label>
        <br>
        <label>考号</label>
</div>

<script>
    let a=document.getElementById("clickon");
    console.log(a.innerHTML);	//获取div内的对象，并作为字符串输出
    /*输出:
    
        <label style="font-size: 10px;">考号</label>
        <br>
        <label>考号</label>
    
    */
    console.log(a.innerText);	//获取div内文本（包括格式
    /*输出：
    考号
	考号
    */
</script>