假設有一個標籤內容如下:
如果要撰寫 JavaScript 存取其中的純文字內容,需要以下的程式碼:
而除了 textContent ,另外也可以引用 innerText 如下:
不過要特別注意的是,在 IE 與 Chrome 瀏覽器下,這兩種方式都沒問題,但是 innerText 不是標準,Firefox 並不支援,如果你在Firefox 瀏覽器檢視,innerText 並不會有任何作用,因此建議一律使用 textContent 以避免跨瀏覽器的問題。
》相關閱讀
======================================================
<p id="msg" ></p>
如果要撰寫 JavaScript 存取其中的純文字內容,需要以下的程式碼:
var text = document.getElementById('msg').textContent ;
document.getElementById('msg').textContent = 'xxx' ;
而除了 textContent ,另外也可以引用 innerText 如下:
var text = document.getElementById('msg').innerText ;
document.getElementById('msg').innerText = 'xxx' ;
不過要特別注意的是,在 IE 與 Chrome 瀏覽器下,這兩種方式都沒問題,但是 innerText 不是標準,Firefox 並不支援,如果你在Firefox 瀏覽器檢視,innerText 並不會有任何作用,因此建議一律使用 textContent 以避免跨瀏覽器的問題。
》相關閱讀
======================================================
3 則留言:
如果要更改標籤內的顯示值
是否也可以用以下方式呢?
http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_elmnt_innerhtml
我個人常用的方法就是使用「.innerHTML」這個屬性(當然,也是要搭配 getElementById() 使用)
不知道 innerHTML 跟上述的兩種
(innerText 與 textContent)
有何差異呢?想請教一下~
不好意思~剛剛似乎有點混淆了
現在有點明白差異處了
我找了兩個例子
例1:http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_node_textcontent
例2:http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_node_textcontent2
各位網友們,可將這兩個例子的
「x.innerHTML=lst.textContent;」改為「x.innerHTML=lst.innerHTML;」
重新 "Submit Code" 一次,然後檢視看看
就明白差異處了,這兩個例子測試出來的效果略有不同哦~
^_^
innerHTML 主要會將標籤內的所有任容回傳,包含子標籤,而 textContent 則只回傳純文字的內容 ... :D
張貼留言