createTextNode проти innerHTML проти textContent
важливість: 5
У нас є пустий DOM-елемент elem
та рядок text
.
Які з цих трьох команд виконають одну й ту ж дію?
elem.append(document.createTextNode(text))
elem.innerHTML = text
elem.textContent = text
Відповідь: 1 та 3.
Результатом обох команд буде text
доданий до elem
«як текст».
Приклад:
<
div
id
=
"
elem1"
>
</
div
>
<
div
id
=
"
elem2"
>
</
div
>
<
div
id
=
"
elem3"
>
</
div
>
<
script
>
let
text =
'<b>text</b>'
;
elem1.
append
(
document.
createTextNode
(
text)
)
;
elem2.
innerHTML =
text;
elem3.
textContent =
text;
</
script
>