jQuery（）没有在jQuery.parseHTML（）结果中查找元素

本文介绍了jQuery（）没有在jQuery.parseHTML（）结果中查找元素的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用QUnit编写测试并使用 $ .ajax（）从本地运行的开发站点获取一些测试的HTML：

I'm writing tests with QUnit and using $.ajax() to pull in HTML for some of the tests from the the dev site running on my local:

add_elements = function(location, selector) { 
  $.ajax(location, {async: false}).done(function(data) {
    stor.$els = $(selector, $.parseHTML(data));
    stor.$els.appendTo($('body'));
  })
}

在某个地点使用此功能，我得到以下 data 传递给我的 .done（）回调：

Using this function at a certain location, I get the following data passed to my .done() callback:

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Home</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="/static/css/bootstrap.min.css" rel="stylesheet" media="screen">

</head>

<body>
<div id="app-container" class="container-fluid">
    <div class="page-header">
        <h1>
            <a href="/">Home</a>
            <small>Text</small>
        </h1>
    </div>

    <div id="hero-units" class="carousel-inner slide">

        <div class="hero-unit home item active">
            <h1>
                Text text text
            </h1>
            <p>
                More text!
            </p>
            <div id="app-nav">
                <a id="lets-go" class="btn btn-primary btn-large nav-forward" href="/what-up/">
                    Let's go
                </a>
            </div>
        </div>

    </div>
</div>

<script src="/static/js/jquery.js"></script>
<script src="/static/js/underscore.js"></script>
<script src="/static/js/backbone.js"></script>
<script src="/static/js/bootstrap.js"></script>
<script src="/static/js/site-fiddle.js"></script>
<script src="/static/js/site.js"></script>

</body>
</html>

如果选择器 <$ c，一切正常$ c>＃hero-units 或 .hero-unit ，但 $（selector，$ .parseHTML（data））如果选择器是＃app-container ，则不返回任何内容！我想要 div＃app-container 元素的 jQuery 对象。

Everything works if selector is #hero-units or .hero-unit, but $(selector, $.parseHTML(data)) returns nothing if selector is #app-container! And I want a jQuery object for the div#app-container element.

这就是杀死我的原因：

$ .parseHTML（数据） 确实包含 div＃app-container 元素。它只是 $。parseHTML（数据）[7] 。

然而， $（'＃app-container'，$ .parseHTML（data））是一个空数组。

$（'div'，$ .parseHTML（data））包括所有 div s里面的 div＃app-container ，但不是 div＃app-container 本身。

$.parseHTML(data) does contain the div#app-container element. It's just $.parseHTML(data)[7].
Yet, $('#app-container', $.parseHTML(data)) is an empty array.
$('div', $.parseHTML(data)) includes all the divs inside of div#app-container, but not div#app-container itself.

这里发生了什么？似乎正在发生的事情是 $ 没有查看 $返回的任何顶级元素.parseHTML（数据）或 $（$。parseHTML（data））），只是他们的孩子。

What's going on here? It appears that what's happening is that $ is not looking at any of the top-level elements returned by $.parseHTML(data) or $($.parseHTML(data))), and just their children.

怎么能我从 $。parseHTML（数据）获得 div＃app-container 的 jQuery 对象）？

How can I get a jQuery object for div#app-container from this $.parseHTML(data)?

ANSWER

$（selector，$ .parseHTML（data）） -style lookup使用 $ .find 。由于我正在寻找这个jQuery对象中的顶级元素，我应该使用 $。filter 。瞧。

The $(selector, $.parseHTML(data))-style lookup uses $.find. Since I'm looking for an element that's top-level in this jQuery object, I should use $.filter instead. Voila.

推荐答案

您需要创建一个DOM元素来附加 .parseHTML（）首先使它在jQuery可以遍历它并找到 div＃app-container 之前创建一个DOM树。

You need to create a DOM element to append the results of .parseHTML() first so that it creates a DOM tree before jQuery can traverse it and find div#app-container.

var tempDom = $('<output>').append($.parseHTML(str));
var appContainer = $('#app-container', tempDom);

我用你的例子让它运转起来：

I used your example and got it working: http://jsfiddle.net/gEYgZ/

.parseHTML（）函数似乎在< script> 标签上窒息，所以我不得不删除它们。

The .parseHTML() function seems to choke on the <script> tags, so I had to remove them.

PS。显然< output> 不是真正的HTML标记，只是将它用于示例

PS. Obviously <output> is not a real HTML tag, just using it for the example

                        这篇关于jQuery（）没有在jQuery.parseHTML（）结果中查找元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！