innertext与innerhtml

<div id="test"> <span style="color:red">test1</span> test2 

</div> <a href="javascript:alert(test.innerHTML)">innerHTML内容</a> <a href="javascript:alert(test.innerText)">inerHTML内容</a> 

共同点:innerHTML和innerText都会把元素内内容替换掉。不同点:1,innerHTML:   也就是从对象的起始位置到终止位置的全部内容,包括Html标签。 

  上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> test2 ”。 2,innerText:   从起始位置到终止位置的内容, 但它去除Html标签 

  上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。 

值得注意的是,innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器,因此,尽可能地去使用innerHTML,而少用innerText,如果要输出不含HTML标签的内容,可以使用innerHTML取得包含HTML标签的内容后,再用正则表达式去除HTML标签。
时间: 2024-10-01 14:22:03

innertext与innerhtml的相关文章

innerText与innerHTML的区别

innerText与innerHTML的区别:1.innerText将所有文本内容作为普通的文本2.innerHTML会识别文本内容中是否含有html标签,它能够把html标签的效果显示出来3.innerText设置<h1>abc</h1>文本时,h1会做为普通文本,   而innerHTML设置<h1>abc</h1>文本时,显示出来的文本只有abc,   但是会以大字体的形式显示出来 <!DOCTYPE html PUBLIC "-//W

Js之Dom学习-三种获取页面元素的方式、事件、innerText和innerHTML的异同

一.三种获取页面元素的方式: getElementById:通过id来获取 <body> <input type="text" value="请输入一个值:" id="txt"/> <input type="button" value="按钮" id="btn"/> <script> var txt=document.getElementB

JS-003-JavaScript 操作常见 web 元素之三-innerText 与 innerHTML 区别

此文主要讲述在使用 innerText 和 innerHTML 获取元素中间值时的差别,我个人将二者的区别简单的理解为: webelement.innerText : 获取的是页面元素显示的文本 webelement.innerHTML : 获取的是元素中间的 HTML 源码 闲话少述,就此上码.敬请小主参阅,若有不足之处,敬请大神指正,不胜感激! 对应的 HTML 页面源码如下所示: 1 <html> 2 <head> 3 <meta charset='utf-8'>

Javascript中的innerText和InnerHTML

(1)几乎所有DOM元素都有innerText和innerHTML属性(注意大小写),分别是元素标签内内容的文本表示形式和HTML源代码. (2)在firefox下,不支持innerText,可以用textContent属性.也可以用innerHTML设置普通文本. (3)用innerHTML也可以替代createElement,属于简单.粗放型.后果自负的创建 (4)innerHTML所有浏览器都支持 示例一:使用innerText和innerHTML <!DOCTYPE HTML PUBLI

jQuery中的text()、html()和val()以及innerText、innerHTML和value

*jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表单设置了value属性): (text()和html()的区别是:前者是处理的文本内容,只能写文本如果写了上面的标记则会以文本形式输出:后者可以解析文本中的html标记,就是你可以添加像<a></a>.<p></p>等标记,最后会解析为其效果.) *JavaSc

innerText跟innerHtml的区别

在一道面试题中看到的. 1.功能讲解: innerHTML 设置或获取位于对象起始和结束标签内的 HTML outerHTML 设置或获取对象及其内容的 HTML 形式 innerText 设置或获取位于对象起始和结束标签内的文本 outerText 设置(包括标签)或获取(不包括标签)对象的文本 1 <html> 2 <head> 3 <title>Demo</title> 4 <style><!-- 5 body {font-famil

js中的innerText、innerHTML、属性值、value与jQuery中的text()、html()、属性值、val()总结

js与jQuery获取text.html.属性值.value的方法是不一样的. js与jQuery,text与innerText获取(<!---->中为结果) html: <p id="test">这是段落中的 <b>粗体</b> 文本.</p> <button id="btn10">jQuery显示text</button> <!--Text: 这是段落中的 粗体 文本.--

innerText和innerHTML的区别

innerhtml用法 innertext用法 以及innerHTML与innertext的区别,看完这个大家以后在实际应用中,就可以选择合适的方法.尽可能的考虑到兼容性. test.innerHTML:  也就是从对象的起始位置到终止位置的全部内容,包括Html标签.  上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> test2 ”. test.innerText:  从起始位置到终止位

jQuery中没有innerText、innerHtml

发现如果我在div或者其他非表单的标签中赋值,原本用普通的js就直接document.getElementById("id").innerHtml(或者其他几个)就可以了. 但是在jQuery中不行 例如: document.getElementById("t").innerHTML="ddddddddddd";     -----------A$("#t").innerHTML="sdsds";