JS的dom获取innerHtml和innerText的区别

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>JSDom获取图层节点</title></head><body><script type="text/javascript">    function getInnerHtml() {

        var dom=document.getElementById("div1");        dom.innerHTML="<h1><font color=‘red‘>这是getInnerHtml</font></h1>";    }    function getInnerText() {        var dom1=document.getElementById("div2");        dom1.innerText="<h1><font color=‘red‘>这是getInnerHtml</font></h1>";

    }</script>

<input  type="button" value="innerHtml" onclick="getInnerHtml()"><div id="div1"></div><br><input  type="button" value="innerText" onclick="getInnerText()"><div id="div2"></div></body></html>

原文地址：https://www.cnblogs.com/god1/p/12114661.html

时间： 2024-10-14 00:25:45

JS的dom获取innerHtml和innerText的区别的相关文章

DOM中的outerHTML,innerHTML,outerText,innerText的区别

--转自http://blog.163.com/yw_0721/blog/static/7164579720102932157759/ 简单的说innerHTML和outerHTML.innerText与outerText的不同之处在于: 1).innerHTML与outerHTML在设置对象的内容时包含的HTML会被解析,而innerText与outerText则不会. 2).在设置时,innerHTML与innerText仅设置标签内的文本,而outerHTML与outerText设置包括标

innerHTML&innerHTML与innerText的区别&outerHTML&innerHTML与html的区别

innerHTML innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML. 语法:HTMLElementObject.innerHTML=text 所有主要浏览器都支持 innerHTML 属性 innerHTML在JS是双向功能:获取对象的内容或向对象插入内容: innerHTML 属性用于设置或返回指定标签之间的 HTML 内容. 语法 Object.innerHTML = "HTML";// 设置 var html = Object.innerHTML;//

Javascript中innerHTML和innerText的区别

innerHTML:获取的是从对象的起始位置到终止位置的全部内容,包括HTML标签 innerText:获取的是起始位置到终止位置的内容,但是会将HTML标签去掉下面写一段代码进行测试: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 </

innerHTML和 innerText的区别

共同点:innerHTML和innerText都会把元素内内容替换掉.不同点:1,innerHTML: 也就是从对象的起始位置到终止位置的全部内容,包括Html标签. 上例中的test.innerHTML的值也就是"<span style="color:red">test1</span> test2 ". 2,innerText: 从起始位置到终止位置的内容, 但它去除Html标签上例中的text.innerTest的值也就是"t

JS的dom获取span和div图层内容

div和span都是图层,每一个图层都是独立的单元,独立的块对象所以他们可以采用很好的进行网页的布局[layout]div灵活 table固定div独占一行 span不会独占一行获取dom对象设置div中的html代码 innerHtml属性不只是在div元素中还是用设置元素nebula的html代码并且这个属相可以将后面的字符串当做一段html代码解释并执行最终展示一个效果 <!DOCTYPE html><html lang="en"><head>

JS的dom获取用户名

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JSDom获取图层节点</title></head><body><script type="text/javascript"> function getUsername() { var dom=docume

innerHTML,outerHTML,innerText,outerText区别以及insertAdjacentHTML()方法

在需要给文档插入大量的新的HTML标记的情况下,通过多次DOM操作先创建节点再指定它们之间的关系会非常麻烦而且效率不高,相对而言插入标记的方法会更加简单,速度也更快. 插入标记中有这四个属性innerHtml,outerHTML,innerText,outerText. 这四个属性都有获取状态和设置状态. 我们先来看一小段代码 <div><p>我是div的子元素</p></div> *在这里我们要先获取这个div,我用divnode代替.在chrome浏览器

innerHTML和innerText的区别

1,返回值的区别区别:取值时 innerText会把只会获取节点里面的文本信息,而innerHTML 会获取节点下面的所有标签. 2.设置值得区别 ====================================== <div id="div1"></div> <script> var div = document.getElementById("div1"); div.innerText = '这里是文本信息<b

innerHTML 与 innerText 的区别

innerHTML指的是从对象的起始位置到终止位置的全部内容,包括Html标签.innerText 指的是从起始位置到终止位置的内容,但它去除Html标签.同时,innerHTML 是所有浏览器都支持的,innerText 是IE浏览器和chrome 浏览器支持的,Firefox浏览器不支持.其实,innerHTML 是W3C 组织规定的属性:而innerText 属性是IE浏览器自己的属性给innerHTML属性设置内容后, 会将内容中包括的标签解析. innerText不会. 实现inne