jQuery - html 字符串上的选择器
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9551230/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery - selectors on a html string
提问by MaxiNet
I am going to get a element from a html-string with jQuery, but I always get an undefined in my console. My String is:
我将使用 jQuery 从 html 字符串中获取一个元素,但我总是在我的控制台中得到一个 undefined 。我的字符串是:
<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>
and I want to get the td.test.
我想得到 td.test。
I've tested:
我测试过:
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').innerHTML);
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').html());
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').first().innerHTML);
and some more, but nothing works :/
还有一些,但没有任何效果:/
Does anyone know a solution for my problem?
有谁知道我的问题的解决方案?
回答by Ry-
First, use jQuery.parseHTML
to parse the HTML into an array of elements; then you'll be able to convert it to a jQuery collection and use filter
to restrict the collection to elements matching a selector.
首先,使用jQuery.parseHTML
将HTML解析为元素数组;然后您将能够将其转换为 jQuery 集合并用于filter
将集合限制为与选择器匹配的元素。
var html =
'<td class="test">asd</td>' +
'<td class="second">fgh</td>' +
'<td class="last">jkl</td>';
var text = $($.parseHTML(html)).filter('.test').text();
console.log(text);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
回答by Charles Goodwin
You can't use jQuery selectors on a collection of nodes like this. You can wrap in a single node to work around this, so just add e.g. a wrapping <tr>
node.
您不能在这样的节点集合上使用 jQuery 选择器。您可以包装在单个节点中以解决此问题,因此只需添加例如包装<tr>
节点。
var htmlBits = '<tr>'
+ '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>'
+ '</tr>';
And then it will work:
然后它会起作用:
console.log($('.test', htmlBits).text()); // outputs 'asd'
JSFiddle(remember to view the console to see the log).
JSFiddle(记得查看控制台查看日志)。
回答by J. Bruni
Try:
尝试:
console.log($('<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').filter('.test').html());
or:
或者:
console.log($('.test', '<table><td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td></table>').html());
回答by juanmf
I have a response that is of the form:
我有以下形式的回复:
<div>...
</div>
<div>...
</div>
<div>...
</div>
And @minitech 's method resulted in an array of HTML nodes in which the selector didn't work.
@minitech 的方法产生了一个 HTML 节点数组,其中选择器不起作用。
So I tried this and it worked out nice:
所以我尝试了这个,结果很好:
$.ajax({
url:
success: function($data) {
var $parsed_data = $('<div/>').append($data);
var found = $parsed_data.find(".Selector");
...
}
});