Question

我有一个非常简单的问题，并继续寻找更复杂的类似问题的答案。我正在尝试替换加载的html中的图像链接，并决定最好使用loadedHTML将html读入字符串变量.get()，如下所示：

$.get(loadURL, function(loadedHTML) {
    myFunction(loadedHTML);
}, 'html');

在myFunction中，我想对加载的html进行一些更改并最终返回它。我无法让.find()工作。这是代码的样子：

function myFunction( html ) {
    var $html = $("<div>" + html + "</div>");
    console.log( "$html.html() = " + $html.html()); // works!
    $html.find("img", function() {
        console.log("found an image"); // doesn't work :(
    });
}

我用一些可能非常简单的东西来杀死自己。让我知道我是多么愚蠢...

Answer 1

我几乎可以肯定你不能以你的方式使用find。

尝试类似：

var $foundImages = $html.find("img");
console.log($foundImages.length);

理论上，这将输出找到的图像数量。

Answer 2

find方法没有第二个参数：

http://api.jquery.com/find/

你应该试试这个：

function myFunction( html ) {
    var $html = $("<div>" + html + "</div>");
    console.log( "$html.html() = " + $html.html()); // works!
    console.log($html.find("img"));
}

Answer 3

只需将id分配给div标签即可。

如下所示，

 var $html = $("<div id='placeholder'>" + html + "</div>");

并在下面找到img，

$("#placeholder").find("img", function() {
    console.log("found an image"); // doesn't work :(
});

您的结果代码，

function myFunction( html ) {
var $html = $("<div id='placeholder'>" + html + "</div>");
console.log( "$html.html() = " + $html.html()); // works!
$("#placeholder").find("img", function() {
    console.log("found an image"); // doesn't work :(
});

}

Answer 4

.find() 在jquery中没有回调函数。它只有selectors,elements,jqueryObject的参数。你必须检查这样的长度或条件

if($html.find("img").length > 0){

      // do stuff here
}

或

  if($html.has("img")){

       // do stuff here
   }

Answer 5

您可以使用此.filter()：

var found = $html.find("img").filter(function() {
    return this;
});
console.log(found);

或使用.map()制作一个数组：

var found = $html.find("img").map(function() {
    return this;
}).get(); // use get() method here to get the values in array
console.log(found.length); // would give you the length of array created.

Answer 6

jQuery.find()没有回调，但你可以扩展jQuery来做你想做的事情：

jQuery.fn.extend({
    findEach: function (selector, callback) {
        var found = this.find(selector);

        if (typeof callback == 'function' && found.length > 0) {
            found.each(callback);
        }
        return found;
    }
});

然后像你期望的那样使用：

$html.findEach("img", function(key, value) {//will run for each image
    console.log(key);
    console.log(value);
    console.log(this);
});

jQuery.find（）不在html变量中工作

6 个答案: