Question

我有以下代码

var page = '<h1>Hello!</h1><p>FOO</p><span class="username">this is ur name</span><p>sample text</p>';

当我提醒$(page).html()我得到你好！当我在div中包装页面内容并提醒$(page).html()时，我得到了整个html内容。

我想在这里完成的是我有一个带有html模板的页面字符串，我正在尝试在其中找到一个类username，我得到null。

我对这种情况感到困惑

这是一个小问题

http://jsfiddle.net/6TSuq/1/

Answer 1

当你调用$(page)时，你构造了一个包含4个元素的jQuery对象;对于没有嵌套在字符串中的每个HTMLElements。

console.log($(page).map(function () {
   return this.nodeName;  
}).toArray());

// ["H1", "P", "SPAN", "P"]

html()返回此jQuery对象中第一个元素的innerHTML;这就是为什么你只看到＆＃34;你好！＆＃34;。

要查找.username，您应该使用filter()方法，该方法在jQuery对象中搜索与给定选择器匹配的元素。

alert($(page).filter('.username').text()); // "this is ur name", kthx.

在此处查看您的更新小提琴; http://jsfiddle.net/6TSuq/15/

请记住，将来你可能会嵌套这样的元素;

var page = "<h1><span class='username'>Foo</span></h1>";

在这种情况下，filter() .username将不会产生任何结果;因为jQuery对象$(page)不包含.username元素;它包含h1，其后代是.username。因此，您需要使用;

alert($(page).find('.username').text());

如需参考，请参阅find()，filter()和map()

Answer 2

一种非常简单的方法是：

var elem = $('<h1>Hello!</h1><p>FOO</p><span class="username">this is ur name</span><p>sample text</p>').filter('.username').get(0);
console.log($(elem).html()); // returns this is ur name

<强> jsFiddle example

首先需要将字符串转换为jQuery对象，以便在其上使用任何jQuery方法。

jQuery find（）问题

2 个答案: