0

jQueryを使用して次のようにホームHTMLを解析したいと思います。ドキュメントを使用しているときは機能しています。ただし、文字列を使用すると機能しません。

出力： null

var str = "<html><title>This is Title</title><body><p>This is a content</p><p class='test'>Test content</p></body></html>";
$str = $(document); // working
$str = $(str);      // not working
alert($str.find(".test").html());

別の方法（これも失敗します）：

出力： null

var str = "<html><title>This is Title</title><body><p>This is a content</p><p class='test'>Test content</p></body></html>";
alert($('.test',str).html());

私が取得している文字列も、有効なXHTMLではないため、XMLとして解析できません。

4

6 に答える 6

7

jQueryはHTMLフラグメントをDOM要素のツリーに変換できますが、それはコンテンツ要素でのみ実行され、、、などでは実行されません。html内部に配置するもののみが実行されます。ですから、それはおそらく最初からいくつかの問題を引き起こしています。titlehead body

このfind関数は、指定されたセレクターに一致する子孫要素を探します。したがって、jQueryインスタンスの最上位要素のいずれかがセレクターと一致する場合でも、それらはによって検出されませんfind。例えば：

$('<p class="foo">foo</p>').find('.foo').length; // 0 -- none found

...一致する要素が子孫ではないため。一致するトップレベルの要素を見つけるには、次を使用しますfilter。

var str = "<p>This is a content</p><p class='test'>Test content</p>";
$(str).find('.test').length; // 0 -- no *descendants* found that match
$(str).filter('.test').length; // 1 -- there was one top-level element that matched

もう1つのアプローチは、使用する前に、すべての要素をdivなどのコンテナーに入れることですfind。

var str = "<div><p>This is a content</p><p class='test'>Test content</p></div>";
$(str).find('.test').length; // 1 -- it was found
于 2012-10-22T12:56:52.860 に答える
1

これを試して：

var str = "<html><title>This is Title</title><body><p>This is a content</p><p class='test'>Test content</p></body></html>";
console.log($($.parseXML(str)).find('.test'));

したがって、最初に文字列をXMLとして解析します。

UPD。TJCrowderがコメントで指摘したように、HMTL文字列が有効なXHTMLであることを確認する必要があります。

そして、プレーンJSのパワーを使用すると、次のようになります。

var parser, xml,
    str = "<html><title>This is Title</title><body><p>This is a content</p><p class='test'>Test content</p></body></html>";

if (window.DOMParser) {
    parser = new DOMParser();
    xml = parser.parseFromString(str, "text/xml");
}
else { // IE
    xml = new ActiveXObject("Microsoft.XMLDOM");
    xml.async = "false";
    xml.loadXML(str);
}

console.log( $(xml).find('.test') );
于 2012-10-22T12:57:04.780 に答える
1

問題は、文字列に完全なHTMLドキュメントが含まれていることです。

これはうまくいくでしょう：

var str = "<div><p>This is a content</p><p class='test'>Test content</p></div>";
alert($(str).find('.test').html());​​​
于 2012-10-22T12:57:09.100 に答える
0

あなたはとても近いです！:)この$(document)行はjQueryセットを返します。追加の変換を行う必要はありません。

$str = $(document); // working
alert($str.find(".test").html());​
于 2012-10-22T12:56:45.450 に答える
0

以下のコードを試してください：

$(str).find(".test").html();

str変数を直接使用します...変数に割り当てないでください。

于 2012-10-22T12:58:00.350 に答える
0

わかりました。有効なXHTMLではないため、XMLに解析できません。しかし、それでも私は自分が望んでいたことを達成するための簡単な愚かな解決策を手に入れました。

var str = "<html><title>This is Title</title><body><p>This is a content</p><p class='test'>Test content</p></body></html>";

//-- replace with document or whatever which will not conflict ---------
str = str.replace(/html>/gi,'document>');

alert($(str).find('.test').html());

出力： Test content.

それは適切な方法ではないかもしれません。しかし、それでもそれはうまくいきます！

ありがとう@TJクラウダー。jQueryはHTMLフラグメントしか解析できないという概念からアイデアを得ました。だから、私たちはこれを達成するために偽造することができます！

于 2012-10-22T14:38:58.067 に答える