10

画像をリクエストせずに、画像タグを含む HTML 文字列を jQuery にロードする方法はありますか? jQuery オブジェクトでセレクターを実行して、情報を抽出できるようにしたいと考えています。次の例を取り上げます。

var string = $('<p><img src="http://image.url/file.jpg" /></p>');
string.find('img');

ブラウザはhttp://image.url/file.jpgをリクエストします。私は同じことを行う方法を見つけようとしていますが、ブラウザが画像を要求することはありません。

ありがとう

4

4 に答える 4

5

XML ドキュメントを使用して検索を実行できます。

function searchXml(xmlStr, selector) {
    var parser, xmlDoc;
    if(window.DOMParser) {
        parser = new DOMParser();
        xmlDoc = parser.parseFromString(xmlStr, "text/xml");
    } else {
        xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = false;
        xmlDoc.loadXML(xmlStr); 
    }
    return $(xmlDoc).find(selector);
}

console.log(searchXml('<p><img src="http://image.url/file.jpg" /></p>', 'img').attr('src'));​​​​

実際に見てみましょう: http://jsfiddle.net/na9Tt/

これは HTML ドキュメントではなく XML ドキュメントであるため、HTML に固有の特定のタイプの検索はまったく同じように機能しない場合があることに注意してください。

于 2012-06-12T23:29:37.503 に答える
3

あなたはあなたの質問の境界について明確にする必要があります。質問が「画像をロードせずに（変更せずに）正確なHTMLをjQueryオブジェクトにロードできる方法はありますか」という場合、答えは「いいえ」です。jQueryは一時的な親オブジェクトを作成し、HTMLをinnerHTMLプロパティに割り当てます。これにより、ブラウザはこのHTMLを完全に解析し、画像のURLを読み込みます。

したがって、画像をロードせずにこのHTMLでセレクター操作を実行する場合は、いくつかのオプションがあります。

  1. HTMLをjQueryに渡す前に、画像タグを変更して、.srcプロパティがなくなっているか空であるか、<img>タグが画像タグではないか、存在しないようにします。

  2. このタイプのjQuery以外のものを使用して、HTMLを解析し、セレクター操作の準備をします。

なぜこれを行おうとしているのか、またはセレクター操作で何をしようとしているのかについてもう少し開示した場合は、おそらくもっと多くの代替案を提案することができます。

于 2012-06-12T23:24:51.090 に答える
3

このように、画像パスを別の属性に追加できます

<img id="imgid" src="" data-src="/path_to_image">

必要に応じて、src 属性を data-src に置き換えることができます。このようなもの

$('#imgid').attr('src',$('#imgid').attr('data-src'));
于 2012-06-12T23:27:49.373 に答える