Program Tip

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

programtip 2020. 10. 16. 08:01
반응형

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


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

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

간단한 Javascript를 사용하여 값을 얻는 방법이 있습니까 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);

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

참고 URL : https://stackoverflow.com/questions/10370204/how-can-get-the-text-of-a-div-tag-using-only-javascript-no-jquery

반응형