diff options
Diffstat (limited to 'files/ru/web/api/element/innerhtml/index.html')
| -rw-r--r-- | files/ru/web/api/element/innerhtml/index.html | 20 |
1 files changed, 10 insertions, 10 deletions
diff --git a/files/ru/web/api/element/innerhtml/index.html b/files/ru/web/api/element/innerhtml/index.html index aebc96174b..c3b5db5ccb 100644 --- a/files/ru/web/api/element/innerhtml/index.html +++ b/files/ru/web/api/element/innerhtml/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Element/innerHTML <h2 id="Синтаксис">Синтаксис</h2> -<pre class="brush: js notranslate">const <var>content</var> = <var>element</var>.innerHTML; +<pre class="brush: js">const <var>content</var> = <var>element</var>.innerHTML; <var>element</var>.innerHTML = <var>htmlString</var>; </pre> @@ -35,11 +35,11 @@ translation_of: Web/API/Element/innerHTML <p>Это свойство предоставляет простой способ полностью заменить содержимое элемента. Например, все содержимое элемента body может быть удалено:</p> -<pre class="brush: js notranslate">document.body.innerHTML = ""; // Заменяет содержимое тела пустой строкой.</pre> +<pre class="brush: js">document.body.innerHTML = ""; // Заменяет содержимое тела пустой строкой.</pre> <p>Свойство innerHTML многих типов элементов, включая {{HTMLElement("body")}} или {{HTMLElement("html")}}, могут быть возвращены или перемещены. Это может так же быть использовано для просмотра кода страницы, которая была изменена динамически:</p> -<pre class="brush: js notranslate">// Скопируйте и вставьте в адресную строку в виде одной строки. +<pre class="brush: js">// Скопируйте и вставьте в адресную строку в виде одной строки. javascript:"<pre>"+document.documentElement.innerHTML.replace(/</g,"&lt;") + "</pre>"; </pre> @@ -49,7 +49,7 @@ javascript:"<pre>"+document.documentElement.innerHTML.replace(/</g,"&am <p>Не редко можно увидеть использование InnerHTML для вставки текста в веб страницу. Это приводит к рискам безопасности.</p> -<pre class="brush: js notranslate">const name = "John"; +<pre class="brush: js">const name = "John"; // предполагая, что 'el' является HTML DOM-элементом. el.innerHTML = name; // безвредный в этом случае @@ -62,7 +62,7 @@ el.innerHTML = name; // безвредный в этом случае</pre> <p>Однако, есть способы запустить JavaScript без использования элементов {{HTMLElement("script")}}, так что есть риск безопасности всякий раз, когда вы используете innerHTML для набора строк, над которыми у вас нет контроля. Например:</p> -<pre class="brush: js notranslate">const name = "<img src='x' onerror='alert(1)'>"; +<pre class="brush: js">const name = "<img src='x' onerror='alert(1)'>"; el.innerHTML = name; // показывает alert</pre> <p>По этой причине, рекомендуется не использовать innerHTML при вставке обычного текста; вместо этого, используйте {{domxref("node.textContent")}}. Это не интерпретирует отправленный контент как HTML, но вместо этого он вставляется как не обработанный текст. </p> @@ -73,7 +73,7 @@ el.innerHTML = name; // показывает alert</pre> <h3 id="JavaScript">JavaScript</h3> -<pre class="brush: js notranslate">function log(msg) { +<pre class="brush: js">function log(msg) { var logElem = document.querySelector(".log"); var time = new Date(); @@ -87,7 +87,7 @@ log("Регистрация событий мыши внутри этого ко <p>Мы добавляем второй метод, который логирует информацию о событиях на основе {{domxref("MouseEvent")}} (например, {{event("mousedown")}}, {{event("click")}}, и {{event("mouseenter")}}):</p> -<pre class="brush: js notranslate">function logEvent(event) { +<pre class="brush: js">function logEvent(event) { var msg = "Event <strong>" + event.type + "</strong> at <em>" + event.clientX + ", " + event.clientY + "</em>"; log(msg); @@ -95,7 +95,7 @@ log("Регистрация событий мыши внутри этого ко <p>Затем мы используем этот обработчик событий на элементе, который содержит наше логирование, для каждого события мыши:</p> -<pre class="brush: js notranslate">var boxElem = document.querySelector(".box"); +<pre class="brush: js">var boxElem = document.querySelector(".box"); boxElem.addEventListener("mousedown", logEvent); boxElem.addEventListener("mouseup", logEvent); @@ -107,7 +107,7 @@ boxElem.addEventListener("mouseleave", logEvent);</pre> <p>HTML довольно простой для нашего примера.</p> -<pre class="brush: html notranslate"><div class="box"> +<pre class="brush: html"><div class="box"> <div><strong>Log:</strong></div> <div class="log"></div> </div></pre> @@ -118,7 +118,7 @@ boxElem.addEventListener("mouseleave", logEvent);</pre> <p>Для нашего примера используем следующие CSS стили.</p> -<pre class="brush: css notranslate">.box { +<pre class="brush: css">.box { width: 600px; height: 300px; border: 1px solid black; |