Computer >> Máy Tính >  >> Lập trình >> Javascript

innerHTML so với innerText trong JavaScript.

bên trongHTML - Thuộc tính innerHTML trả về văn bản, bao gồm tất cả các thẻ khoảng cách và phần tử bên trong. Nó giữ nguyên định dạng của văn bản và tất cả các thẻ phụ như , v.v.

innerText - Thuộc tính innerText chỉ trả về văn bản, loại bỏ khoảng cách và các thẻ phần tử bên trong.

Sau đây là mã cho innerHTML và innerText trong JavaScript -

Ví dụ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result,
   .sample {
      font-size: 18px;
      font-weight: 500;
      color: red;
   }
</style>
</head>
<body>
<h1>innerHTML vs innerText</h1>
<div class="sample">Hello <b>World</b> <i>Some Text</i></div>
<div class="result">innerHTML =</div>
<div class="result">innerText =</div>
<button class="Btn">Click here</button>
<h3>Click on the above button to see the innerText and innerHTML result for
the above paragraph</h3>
<script>
   let BtnEle = document.querySelector(".Btn");
   let resEle = document.querySelectorAll(".result");
   let sampleEle = document.querySelector(".sample");
   let a;
   BtnEle.addEventListener("click", () => {
      resEle[0].innerHTML += sampleEle.innerHTML;
      resEle[1].innerHTML += sampleEle.innerText;
   });
</script>
</body>
</html>

Đầu ra

innerHTML so với innerText trong JavaScript.

Khi nhấp vào nút 'BẤM VÀO ĐÂY' -

innerHTML so với innerText trong JavaScript.