Нужно найти теги под тегом в XML с помощью jQuery

Question

У меня есть этот xml как часть responseXml вызова Ajax:

<banner-ad>
    <title><span style="color:#ffff00;"><strong>Title</strong></span></title>
</banner-ad>

Когда я использовал этот jQuery (responseXml) .find ("title"). Text (); результат "Заголовок". Я также попробовал jQuery (responseXml) .find ("title: first-child"), но в результате получился [объект Object].

Я хочу получить результат:

<span style="color:#ffff00;"><strong>Title</strong></span>

Пожалуйста, дайте мне знать, как это сделать в jQuery.

Заранее спасибо за любую помощь.

С уважением, Racs

Answer 1

Ваша проблема в том, что вы не можете просто добавлять узлы из одного документа (ответ XML) в другой (ваша HTML-страница). Вопрос двоякий:

1. Вы можете использовать jQuery для добавления узлов из XML-документа на HTML-страницу. Это работает; узлы появляются в HTML DOM, но они остаются узлами XML, и поэтому браузер, например, игнорирует атрибут style. Следовательно, текст не будет желтым (#ffff00).
2. Насколько я вижу, jQuery не предлагает встроенного способа получить строку XML (то есть сериализованный узел) из узла XML. jQuery может хорошо обрабатывать XML-документы, но нет эквивалента тому, что .html() делает в HTML-документах.

Итак, чтобы сделать это, нам нужно извлечь строку XML из документа XML. Некоторые браузеры поддерживают свойство .xml на узлах XML (а именно IE), другие поставляются с объектом XMLSerializer:

// find the proper XML node
var $title = $(doc).find("title");

// either use .xml or, when unavailable, an XMLSerializer 
var html = $title[0].xml || (new XMLSerializer()).serializeToString($title[0]);

// result:
// '<title><span style="color:#ffff00;"><strong>Title</strong></span></title>'

Затем мы должны передать эту HTML-строку в jQuery, чтобы из нее можно было создать новые реальные HTML-элементы:

$("#target").append(html);

Есть скрипка, чтобы показать это в действии: http://jsfiddle.net/Tomalak/QWHj8/. Этот пример также избавляет от лишнего элемента <title>.

---

Во всяком случае. Если у вас есть возможность повлиять на сам XML, имеет смысл изменить его:

<banner-ad>
    <title>&lt;span style="color:#ffff00;"&gt;&lt;strong&gt;Title&lt;/strong&gt;&lt;/span&gt;</title>
</banner-ad>

Просто XML-кодирование полезной нагрузки <title>, и вы можете сделать это в jQuery:

$("#target").append( $(doc).find("title").text() );

Answer 2

Это, вероятно, будет работать:

$(responseXml).find("title").html();