innerText和textContent對比及使用介紹
更新時間：2013年02月27日 10:53:35 作者：
innerText使用過程中遇到了FireFox的兼容問題FireFox不支持innerText方法但是有個類似的方法，叫textContent，類似innerText，都是用來獲取（設(shè)置）元素中text的方法,感興趣的朋友可以參考下
今天在使用innerText時遇到一個兼容性問題，F(xiàn)ireFox不支持innerText方法，查了下MDN，發(fā)現(xiàn)FireFox下有個類似的方法，叫textContent，它和IE的innerText類似， 都是用來獲?。ㄔO(shè)置）元素中text的方法。
語法
•設(shè)置
element.textContent = “text”;
•獲取
var text = element.textContent;
Note: textContent和innerText類似，也會同時獲取子元素的text content，比如
<div>this is <span>a</span> text!</div>
// div.textContent == "this is a text!"
與innerText的區(qū)別
•textContent會獲取所有元素的content，包括`<script>`和`<style>`元素
•innerText不會獲取hidden元素的content，而textContent不會
•innerText會觸發(fā)reflow，而textContent不會
•innerText返回值會被格式化，而textContent不會
主流瀏覽器支持情況
•IE 9+
•Chrome 1+
•FireFox(Gecko)
語法
•設(shè)置
復(fù)制代碼 代碼如下:
element.textContent = “text”;
•獲取
復(fù)制代碼 代碼如下:
var text = element.textContent;
復(fù)制代碼 代碼如下:
Note: textContent和innerText類似，也會同時獲取子元素的text content，比如
<div>this is <span>a</span> text!</div>
// div.textContent == "this is a text!"
與innerText的區(qū)別
•textContent會獲取所有元素的content，包括`<script>`和`<style>`元素
•innerText不會獲取hidden元素的content，而textContent不會
•innerText會觸發(fā)reflow，而textContent不會
•innerText返回值會被格式化，而textContent不會
主流瀏覽器支持情況
•IE 9+
•Chrome 1+
•FireFox(Gecko)
相關(guān)文章
IE與Firefox在JavaScript上的7個不同句法分享
盡管那需要用長串的、沉悶的不同分支代碼來應(yīng)付不同瀏覽器的日子已經(jīng)過去，偶爾還是有必要做一些簡單的區(qū)分和目標檢測來確保某塊代碼能在用戶的機器上正常運行2011-10-10
JS實現(xiàn)帶導(dǎo)航城市列表以及輸入搜索功能
這篇文章主要為大家詳細介紹了JS實現(xiàn)帶導(dǎo)航城市列表以及輸入搜索功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-01-01
這篇文章主要為大家詳細介紹了js實現(xiàn)電燈開關(guān)效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-01-01
這篇文章主要介紹了基于原生js實現(xiàn)判斷元素是否有指定class名,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-07-07
javascript實現(xiàn)判斷鼠標的狀態(tài)
這篇文章主要介紹了javascript實現(xiàn)判斷鼠標的狀態(tài)的相關(guān)代碼，十分簡單實用，有需要的小伙伴可以參考下。2015-07-07
這篇文章主要介紹了JavaScript中的ubound函數(shù)使用實例,本文先是講解了ubound函數(shù)的語法,然后給出了用法代碼實例,需要的朋友可以參考下2014-11-11
這篇文章主要介紹了JS+DIV+CSS實現(xiàn)仿表單下拉列表效果,涉及javascript鼠標事件及頁面元素的動態(tài)操作技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
這篇文章主要為大家詳細介紹了js實現(xiàn)模態(tài)框的拖拽效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
深入webpack打包原理及l(fā)oader和plugin的實現(xiàn)
這篇文章主要介紹了深入webpack打包原理及l(fā)oader和plugin的實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05
這篇文章主要介紹了js獲取域名的方法,涉及window.location中常見方法的使用技巧,需要的朋友可以參考下2015-01-01