DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> Javascript教程:innerText屬性在火狐實現的實例
Javascript教程:innerText屬性在火狐實現的實例
編輯:關於JavaScript     

很多代碼寫了又忘忘了又寫,很浪費,所以決定養成做筆記的習慣。

知識點:

0、為什麼要innerText?因為安全問題

1、為firefox dom模型擴展屬性

2、currentStyle屬性可以取得實際的style狀態

3、IE實現innerText時考慮了display方式,如果是block則加換行

4、為什麼不用textContent?因為textContent沒有考慮元素的display方式,所以不完全與IE兼容

<html>
<body>
<div id="d1"><a href="aa">ccc</a>ddd<div>eeee</div>fff</div>
<script type="text/javascript">
<!--
//
// patch of innerText for firefox
//
(function (bool) {
function setInnerText(o, s) {
while (o.childNodes.length != 0) {
o.removeChild(o.childNodes[0]);
}

o.appendChild(document.createTextNode(s));
}

function getInnerText(o) {
var sRet = "";

for (var i = 0; i < o.childNodes.length; i ++) {
if (o.childNodes[i].childNodes.length != 0) {
sRet += getInnerText(o.childNodes[i]);
}

if (o.childNodes[i].nodeValue) {
if (o.currentStyle.display == "block") {
sRet += o.childNodes[i].nodeValue + "\n";
} else {
sRet += o.childNodes[i].nodeValue;
}
}
}

return sRet;
}

if (bool) {
HTMLElement.prototype.__defineGetter__("currentStyle", function () {
return this.ownerDocument.defaultView.getComputedStyle(this, null);
});

HTMLElement.prototype.__defineGetter__("innerText", function () {
return getInnerText(this);
})

HTMLElement.prototype.__defineSetter__("innerText", function(s) {
setInnerText(this, s);
})
}
})(/Firefox/.test(window.navigator.userAgent));
//-->
</script>

<script type="text/javascript">
<!--
var d1 = document.getElementById("d1");

alert(d1.innerText);
d1.innerText = "xxx";
//-->
</script>
</body>
</html>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved