innerHTML和innerTEXT的区别

来源:互联网 发布:c语言根号 编辑:程序博客网 时间:2024/05/29 11:06
<div id="box">    <p>这是一个P标签</p>    <p>这是一个P标签</p>    <p>这是一个P标签</p>    <p>这是一个P标签</p></div>
var box = document.getElementById("box");   console.log(box.innerText); 

这是innerText的用法 ,直接获取标签之间的文本内容

这里写图片描述

   console.log(box.innerHTML);

这是一个innerHTML的用法,将标签之间的所有内容都打印了出来 ,包括标签,而且是将内容原样打印输出出来

这里写图片描述

还有另一种用法,就是设置的用法

box.innerText = "<ul><li>123</li><li>456</li><li>789</li></ul>";

innerText设置的时候,无法设置标签,会将标签进行转义直接显示出来

box.innerHTML="<ul><li>123</li><li>456</li><li>789</li></ul>";

如果给innertHTML赋值的话,会将里面的标签渲染解析出来,解析成正常的HTML标签

通常用innerHTML来进行字符串拼接操作

原创粉丝点击