匿名質問者

jQuery.ajax()で外部HTMLファイルを読み込み、要素を取得したいのですが、最上層の要素を取得することが出来ません。

・jsファイル
---------------------------------------------------------------------------
$("#button").click(function() {
$.ajax({
type: 'GET',
url: 'file.html',
dataType: 'html',
success: function (data) {
console.log($('div', $(data)));
},
});
});
---------------------------------------------------------------------------

・file.html
---------------------------------------------------------------------------
<div class="test">test</div>
---------------------------------------------------------------------------


ちなみに、以下のようにdiv.testをdivでさらに囲んでやると取得することが出来るようです。

---------------------------------------------------------------------------
<div class="wrap">
<div class="test">test</div>
</div>
---------------------------------------------------------------------------


jQueryのバージョンは1.11、ブラウザはSafari 7.05を使用しています。

どのようなスクリプトで最上層の要素を取得することができるのでしょうか?

回答の条件
  • 1人5回まで
  • 登録:
  • 終了:2014/08/18 00:08:16

ベストアンサー

匿名回答1号 No.1

$(function() {
    $("#button").click(function() {
        $.ajax({
            type: 'GET',
            url: 'file.html',
            dataType: 'html',
            success: function (data) {
                console.log($(data));
                },
            });
    });
});
匿名質問者

回答ありがとうございます。
$(data)でjQueryオブジェクトに変換した場合、ルートノードがdiv.testになってしまい、find()などで検索をかけるとルートノードの子孫の中から検索するようです。

今のところ解決策として、質問にも書いてある通りdivなどで囲んでやる(ルートノードを作る)ことでdiv.testを取得するか、

newDoc = document.implementation.createHTMLDocument(title);

みたいな感じでDocumentオブジェクトを生成して、その中にdataを入れてやることでしか対応できないのかなと思っております。

初めて人力検索を利用させて頂きまして、匿名で質問させて頂いたのですが匿名でない方がご回答を頂きやすいかなと思い、以下ページで質問し直しました。

http://q.hatena.ne.jp/1408208784

2014/08/17 23:38:35

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません