freeCodeCamp/guide/russian/javascript/html-dom-innerhtml-property/index.md

2.0 KiB
Raw Blame History

title localeTitle
HTML Dom Innerhtml Property Свойство HTML Dom Innerhtml

Свойство HTML Dom Innerhtml

Внутренняя поддержка innerHTML возвращает содержимое HTML внутри выбранного элемента, а также позволяет вам определять новый HTML-контент.

СОДЕРЖАНИЕ


<div id="demo"> 
  <p>Demo</p> 
 </div> 
var element = document.getElementById("demo"); 
 console.log(element.innerHTML) //logs <p>Demo</p> 

СОДЕРЖАНИЕ ЭЛЕМЕНТА


<div id="demo"></div> 
var element = document.getElementById("demo"); 
 element.innerHTML = "<div>Demo</div>"; 

HTML теперь будет как


<div id="demo"> 
  <div>Demo</div> 
 </div> 

ОБСУЖДЕНИЕ БЕЗОПАСНОСТИ

Значение, установленное для innerHTML должно поступать из надежных источников, поскольку Javascript будет помещать что-либо внутри этого элемента, и он будет запущен как простой HTML.

Пример:

Установка значения « <script>alert();</script> » приведет к запуску функции «alert ()» Javascript:

var element = document.getElementById("demo"); 
 
 element.innerHTML = "<script>alert();</script>"; 

Этот тип атаки называется Cross Site Scripting, или XSS для краткости .

Это один из наиболее распространенных способов совершения атаки XSS. Если вы хотите узнать немного больше и научиться защищаться от него, ознакомьтесь с этим ресурсом