DEV/javascript
Javascript innerText, innerHTML, textContent 차이
석봉
2022. 4. 28. 23:13
결과
Text : 노드내의 보이는 텍스트 추출
HTML : HTML이나 XML을 불러옴
textContent : 노드내의 모든 텍스트 추출
test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<div id="testDiv">
<div>테스트 코드 입니다.</div>
<div style="display:none">보이지 않는 div</div>
</div>
</body>
<script src="./test.js"></script>
</html>
test.js
$(document).ready(function() {
console.log("innerText : ", document.getElementById('testDiv').innerText);
console.log("innerHTML : ", document.getElementById('testDiv').innerHTML);
console.log("textContent : ", document.getElementById('testDiv').textContent);
});