web-dev-qa-db-ja.com

jQuery-HTML文字列のセレクター

JQueryを使用してhtml-stringから要素を取得しますが、コンソールでは常に未定義を取得します。私のストリングは：

<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>

そして、td.testを取得したいです。

私はテストしました：

console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').innerHTML);
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').html());
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').first().innerHTML);

そしてさらにいくつか、しかし何も動作しません：/

誰かが私の問題の解決策を知っていますか？

jqueryhtmlstringjquery-selectors
31
MaxiNet

まず、jQuery.parseHTML HTMLを要素の配列に解析します。それをjQueryコレクションに変換し、filterを使用して、セレクターに一致する要素にコレクションを制限することができます。

var html =
    '<td class="test">asd</td>' +
    '<td class="second">fgh</td>' +
    '<td class="last">jkl</td>';

var text = $($.parseHTML(html)).filter('.test').text();

console.log(text);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
53
Ry-

試してください：

console.log($('<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').filter('.test').html());

または：

console.log($('.test', '<table><td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td></table>').html());
4
J. Bruni

このようなノードのコレクションでjQueryセレクターを使用することはできません。この問題を回避するために単一のノードにラップすることができます。ラッピング<tr>ノード。

var htmlBits = '<tr>'
  + '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>'
  + '</tr>';

そして、それは動作します：

console.log($('.test', htmlBits).text()); // outputs 'asd'

JSFiddle （コンソールを表示してログを表示することを忘れないでください）。

2
Charles Goodwin

次の形式の応答があります。

<div>...
</div>

<div>...
</div>

<div>...
</div>

そして@minitechのメソッドは、セレクターが機能しなかったHTMLノードの配列をもたらしました。

だから私はこれを試してみましたが、うまくいきました：

$.ajax({
    url:
    success: function($data) {
         var $parsed_data = $('<div/>').append($data);
         var found = $parsed_data.find(".Selector");
         ...
    }
});
0
juanmf