예:
Hello , world!
> 다음 코드를 사용합니다: Alert((document.getElementById("test")).innerText)
IE와 Chrome에서는 "Hello, world!"를 얻을 수 있지만 Firefox에서는 "undefine"을 얻습니다. ". 원래 이유는 Firefox가 요소의 innerText 속성을 지원하지 않기 때문입니다. 물론 인터넷에는 HTMLElement 프로토타입에 속성(리더)을 추가하는 등 이 문제를 해결할 수 있는 좋은 방법이 이미 많이 나와 있습니다.
그러나 모든 텍스트 노드에는 nodeValue 속성이 있으며 모든 브라우저는 이를 지원합니다. 이 방법을 사용하여 HTML 요소 내의 텍스트를 읽을 수 있습니다.
다음 원본 코드는 이 문제를 해결합니다.
function getText(e) {
//브라우저가 요소의 innerText 속성을 지원하는 경우 이 속성을 직접 반환합니다.
if(e.innerText) { return e.innerText } //innerText 속성이 지원되지 않습니다. 다음 방법을 사용하여
var t = ""
//요소 객체가 전달되면 해당 하위 요소에 계속 액세스합니다.
e = e.childNodes || e;
//하위 요소의 모든 하위 요소 탐색
for(var i=0; i//If 이는 텍스트 요소이며 문자열 t에 누적됩니다.
if(e[i].nodeType == 3) { t = e[i].nodeValue }
//그렇지 않으면 요소의 모든 하위 노드를 재귀적으로 순회합니다.
else { t = getText (e[i].childNodes); }
}
return t;
}
이 함수를 사용하여 다음 DOM을 살펴보겠습니다. 구조:
Hello , world!
그런 다음
alert(getText(document.getElementById("test"));
IE, Chrome 및 Firefox에서 "Hello, world!"를 얻을 수 있습니다.