jQuery.parseHTML()

jQuery.parseHTML( data [, context ] [, keepScripts ] )Возвращает: Массив

Описание: Парсит строку в массив узлов DOM.

версия добавлена: 1.8jQuery.parseHTML( data [, context ] [, keepScripts ] )
- data
  
  Тип: Строка
  
  Строка HTML для парсинга
- context (по умолчанию: document)
  
  Тип: Элемент
  
  Элемент документа, который будет служить контекстом при создании фрагмента HTML
- keepScripts (по умолчанию: false)
  
  Тип: Булево
  
  Логическое значение, указывающее, нужно ли включать скрипты, переданные в строке HTML

jQuery.parseHTML использует родные методы для преобразования строки в набор узлов DOM, которые затем можно вставить в документ. Эти методы отображают весь текст (даже если это просто пробелы). Чтобы предотвратить преобразование отступов/лидирующего пробела в узлы текста, можно передать строку HTML через jQuery.trim.

По умолчанию, context является текущим document, если не указано иное или задано как null или undefined. Если HTML необходимо использовать в другом документе, например, в iframe, можно использовать документ этого фрейма.

Начиная с версии 3.0, поведение по умолчанию изменено. Если context не указано или задано как null или undefined, используется новый document. Это потенциально может улучшить безопасность, так как встроенные события не будут выполняться при парсинге HTML. После вставки обработанного HTML в документ, они выполняются, но это даёт инструментам возможность пройтись по созданному DOM и удалить всё, что считается небезопасным. Это улучшение не относится к внутренним использованиям jQuery.parseHTML , так как они обычно передают текущий document. Таким образом, инструкция, подобная $( "#log" ).append( $( htmlString ) ), по-прежнему подвержена внедрению вредоносного кода.

Соображения безопасности

Большинство API jQuery, которые принимают строки HTML, будут выполнять скрипты, включенные в HTML. jQuery.parseHTML не выполняет скрипты в обработанном HTML, если keepScripts явно не true. Однако, в большинстве сред всё ещё возможна косвенная загрузка скриптов, например, через атрибут <img onerror>. Вызывающая сторона должна быть осведомлена об этом и защищаться от этого, очищая или экранируя любые недоверенные входные данные из таких источников, как URL или cookie. Для обеспечения совместимости в будущем вызывающие стороны не должны полагаться на возможность выполнения любого содержимого скрипта, когда keepScripts не указано или false.

Пример:

Создайте массив узлов DOM, используя строку HTML, и вставьте его в div.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery.parseHTML demo</title>
  <script src="https://code.jquery.com/jquery-3.7.0.js"></script>
</head>
<body>
 
<div id="log">
  <h3>Content:</h3>
</div>
 
<script>
var $log = $( "#log" ),
  str = "hello, <b>my name is</b> jQuery.",
  html = $.parseHTML( str ),
  nodeNames = [];
 
// Append the parsed HTML
$log.append( html );
 
// Gather the parsed HTML's node names
$.each( html, function( i, el ) {
  nodeNames[ i ] = "<li>" + el.nodeName + "</li>";
});
 
// Insert the node names
$log.append( "<h3>Node Names:</h3>" );
$( "<ol></ol>" )
  .append( nodeNames.join( "" ) )
  .appendTo( $log );
</script>
 
</body>
</html>