JS中的innerHTML和innerText

今天在进行DOM总结的时候遇到了innerHTML，由于在前几天看到了小伙伴总结了一篇关于innerHTML和innerText的博客总结，于是自己也开始搜查资料做一个小小的总结。

1.innerHTML可获取或设置指定dom元素标签内的 html内容，从该元素标签的起始位置到终止位置的全部内容(包含html标签)。

获取元素的内容：element.innerHTML;

给元素设置内容：element.innerHTML =htmlString;

2.innerText可获取或设置指定元素标签内的文本值，从该元素标签的起始位置到终止位置的全部文本内容(不包含html标签)。

获取元素的内容：element.innerText;

给元素设置内容：element.innerText = string;

3.区别

innerHTML返回的是标签内的 html内容，包含html标签;

innerText返回的是标签内的文本值，不包含html标签;

实例：【获取元素内容】

<!DOCTYPE html>
<html>
<head><meta charset="utf-8" /><title></title><script type="text/javascript">function getinnerHTML() {alert( document.getElementById("test").innerHTML);}function getinnerText() {alert( document.getElementById("test").innerText);}</script>
</head>
<body><p id="test"><font color="#000">获取段落p的innerHTML</font></p><!--//给按钮一个单机事件--><input type="button" onclick="getinnerHTML()" value="innerHTML" /><input type="button" onclick="getinnerText()" value="innerText" />
</body>
</html>

实例：给元素设置内容

JS中的innerHTML和innerText相关推荐

JS中的innerHTML，innerText，outerHTML的区别
一, 直接看demo <body><div id="test"><p>第一个</p></div><script t ...
JS，Jquery innerhtml html innertext text的用法
html()方法此方法类似于JavaScript中的innerHTML属性,可以用来读取或者设置某个元素中的HTML内容.要获取某个元素的内容,可以这样: var p_html = $(" ...
js中的innerHTML的作用
js中常常用到innerHTML,其作用就是获取到标签里面的内容,同时也可以为标签添加内容 <div><p id="text">hello world< ...
innerHTML连接指定HTML文件,js中innerhtml的用法
js中innerHTML与innerText的用法与区别 js中innerHTML的用法: innerHTML可获取或设置指定元素标签内的 html内容,从该元素标签的起始位置到终止位置的全部内容(包 ...
js中innerHTML和innerText jQuery中html()和text()的区别
js中innerHTML和innerText的区别 innerHTML innerHTML 会将标签和标签中的内容否获取回来 innerHTML .innerHTML = '<p>&l ...
js中innerHTML与innerText的用法与区别【转自http://blog.sina.com.cn/johnpu】
用法:SupeSite/X-Space官方站%x-ZP$k?'DWZ_{ SupeSite/X-Space官方站K?_/T9s3^QJ a4X <div id="test"& ...
html页面的text用法,js中innerHTML，innerText，outerHTML用法总结
如何获取DIV里面的内容,在js中为大家提供了三种方法,分别是outerHTML.innerHTML和innerText,这里要注意大小写!看起来长得很像,那么到底怎么使用以及它们之间有什么区别,我想 ...
JS中innerHTML,innerText,outHTML的用法及区别
一张图解释: 对于一个id为"testdiv"的div来说,outerHTML.innerHTML以及innerTEXT三者的区别可以通过下图展示出来: 文字解释: innerHT ...
JS中innerHTML、outerHTML、innerText、outerText的用法与区别
1.功能说明: innerHTML 设置或获取位于对象起始和结束标签内的 HTML innerText 设置或获取位于对象起始和结束标签内的文本 outerHTML 设置或获取对象及其内容的HTML形 ...

JS中的innerHTML和innerText

JS中的innerHTML和innerText相关推荐

最新文章

热门文章