在jquery的选择根元素

StackOverflow https://stackoverflow.com/questions/1650063

  •  22-07-2019
  •  | 
  •  

题

我需要能够从一个的片段选择的根元素不知道的节点类型，类，ID或层次结构。

<div id="0">
    <div id="0a">
        <div id="a01"></div>
    </div>
    <div id="0b">
    </div>
    <div id="0c">
    </div>
</div>

我希望能够像做$（“：根”）。与在上面的例子中选择的具有0

更好的是我宁愿$(':level(0)')这将意味着与上述相同，$(':level(1)')将选择0A，0B及0℃和$(':level(1)>div')将选择A01。

这是如何巧妙地做到这一点任何想法？

有帮助吗？

解决方案

虽然这个问题是完全正确前一阵子回答 - 我只是想尝试这个自己，并没有使用像*:not(* *)选择过于激烈 - 因为可能的开销为主。我不知道这是否是最近才加入jQuery的能力的（我用1.8）的，但你可以使用：

$(':eq(0)');

这将选择第一个发现的非textnode元素，所以，除非你是遍历DOM在它的形成是非法的，你应该总是让根元素。它也是高度最佳因为jQuery应该知道停止第一元件之后发现

所以这里的所有的那些WSOD球迷在那里一点点东西：

$(':eq(0)').remove();

哦，以防万一它是不是很明显，上面的代码片段只是说明了选择，你会发现自己与部分片段（而不是完整的文档）的工作，那么你应该使用这个选择与jQuery的过滤器方法：

$(fragment).filter(':eq(0)');

然而，随着碎片的工作时，你可以做到以下几点：

$(fragment).get(0);

虽然谨记.get(0)可以选择文本/注释节点，如果他们是你的文档中的第一项，而过滤器的方法总是会找到第一个实际的元素。

其他提示

OK，所以你需要做的是（假设你正在使用你已经得到了样品）以下的，如果你想找到使用jQuery顶级节点如下：

 $('*:not(* *)');

什么你是从字面上询问这里是不属于其它节点的所有子节点。问题是，对于一个HTML文档，这将永远给你只有html元素，这不是特别有用。所以，如果你想找到一个html文件的正文中最高级别的元素，你会使用的东西容易得多了：

 $('body > *');

如果你当时就想第二个层次，你只是去

 $('body > * > *');

但是，假设你有某种任意文档结构（如FOO一个你提到），你可以做的是使用第一个例子中找到第一级：

 $('*:not(* *)');

和然后为第二级

 $('*:not(* *)').find('> *');

和用于第三级

 $('*:not(* *)').find('> * > *');

和等等，等等。如果你正在寻找一个根div元素（假设你的样品是一样的问题），你可以这样做：

 $('div:not(div div)');

和等，具有取代的div *。真的不知道为什么你会想这样做，但它会奏效。问题是，这个问题并没有真正提供足够的背景下我们给你一个更好的选择。

我更原型的家伙，但我认为你可以得到所有的节点然后得到数组中的第一个节点：

$('*')[0]

然后得到的孩子的项目（0A，0B及0℃）

$('*')[0].children()

如果你有你的元素作为一个jQuery的片段，如：

var myElements = $('<div id="0">
<div id="0a">
    <div id="a01"></div>
</div>
<div id="0b">
</div>
<div id="0c">
</div>
</div>');

，那么您可以通过找到第一个元素：

myElements.filter(":first")

在过滤器函数看起来从该片段的根元素。

不需要

...的jQuery 

var root = document.firstChild;

我可以误解的问题，但通过根假设你的意思在该亲本是不同的标签到子那么点以下应该工作。

function GetRoot(element) {
    while(element.parent().attr("tagName") == element.attr("tagName")) {
        element = element.parent();
    }

    return element;
}

这基本上走到树，直到它找到一个父这是一个不同的标签，然后返回该项目。对于示例，这将意味着，如果您的元件是在一个，或任何它会检测到它作为根并将其返回。

制作用此自定义jQuery选择应该是可能的太多，但显然更复杂。

它也应该很容易扩展这个采取定义级别的整数。所有你需要做的就是走在树到指定的深度，一旦你已经找到了根，并返回这些元素。

您可以考虑使用父（）和儿童（）函数。是你需要去多层次的，你可以把它们连像这样。

$("#a01").parent().parent()  //returns <div id="0">

请看到我的评论，我会尽力提供更好的解决方案。

我从Ajax调用HTML片段，并且我还需要从它那里得到根本股利。我所做的是只需拨打$(data)和jQuery将解析返回文本作为HTML，给你的根。

$.ajax path,
  type: 'GET'
  contentType: 'application/x-www-form-urlencoded;charset=UTF-8'
  success: (data) ->
    $(data)

如果你想选择一个元素的顶级父，但仍身下，我会去

$(obj).parents().filter('body > *')
许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top