[javascript] 자바 스크립트 만 사용하여 div 태그의 텍스트를 얻는 방법 (jQuery 없음)

Program / 글쓴이

나는 이것을 시도했지만 “정의되지 않음”을 표시합니다.

function test() {
var t = document.getElementById('superman').value;
alert(t); }

간단한 Javascript no jQuery를 사용하여 값을 얻는 방법이 있습니까?

답변

당신은 아마 시도하려는 것 textContent대신에 innerHTML.

을 감안할 때 innerHTMLA와 DOM의 콘텐츠를 반환 String하지 독점적으로 “텍스트”절의 div. div텍스트 만 포함되어 있지만 모든 사용 사례에 적합하지 않다는 것을 알고 있으면 괜찮습니다 . 이러한 경우에는 textContent대신 사용해야 할 것입니다.innerHTML

예를 들어, 다음 마크 업을 고려하십시오.

<div id="test">
  Some <span class="foo">sample</span> text.
</div>

다음과 같은 결과를 얻을 수 있습니다.

var node = document.getElementById('test'),

htmlContent = node.innerHTML,
// htmlContent = "Some <span class="foo">sample</span> text."

textContent = node.textContent;
// textContent = "Some sample text."

자세한 내용은 MDN을 참조하십시오.

답변

textContentIE8 및 이전 버전에서는 지원되지 않기 때문에 다음 과 같은 해결 방법이 있습니다.

var node = document.getElementById('test'),
var text  = node.textContent || node.innerText;
alert(text);

innerText IE에서 작동합니다.

답변

을 사용하거나 innerHTML(그런 다음 HTML에서 텍스트를 구문 분석) innerText.

let textContentWithHTMLTags = document.querySelector('div').innerHTML;
let textContent = document.querySelector('div').innerText;

console.log(textContentWithHTMLTags, textContent);

innerHTML및 innerText포함 (파이어 폭스 제외한 <44) 모든 브라우저에서 지원되는 IE6 .

답변

실제로 .NET Framework에 document.getElementById()액세스하기 위해 함수 를 호출 할 필요가 없습니다 div.

다음과 같이 object직접 사용할 수 있습니다 id.

text = test.textContent || test.innerText;
alert(text);

답변