Question

如果我在这里错过了显而易见的事情，那就不确定了，但我已经试图解决这个问题了。

我想找到容器的第一个子容器，然后返回其元素或类，并使用它来获取该容器中的任何其他顶级匹配元素。

例如

<div class="box">
    <a href="#">The First Element</a>
    <div><p> some content with a <a href="#">link that should not be included</a></div>
    <h2>a heading</h2>
    <p>this is some content</p>
    <a href="#">This link should be found by the search</a>
</div>

所以我想使用jQuery找出第一个孩子是什么（在这种情况下是'a'标签），然后搜索任何匹配的元素，我宁愿只得到直接的后代，任何想法？

编辑：感谢您的回复 - 我认为我首先想到的是.prop方法，必须测试几个解决方案，看看哪个最适合....更新即将推出。< / p>

Answer 1

var $box = $('.box'), 
    $first = $box.children().first(),
    type = $first.prop('localName'),
    $matching = $box.children(type);

http://jsfiddle.net/X8hgP/

Answer 2

看看这个 - http://jsfiddle.net/xyK72/

var selectedElement = $('.box > :first-child').prop('tagName');
$('.box > :first-child').siblings(selectedElement).addClass('highlight');

请注意，您正在寻找兄弟，而不是后代。

Answer 3

有点不清楚，所以这里有一些选择：我将背景石灰转化为前几个。

第一个链接的所有兄弟姐妹然后：

$('a:first').siblings().css('background-color', 'lime');

框内第一个元素的所有兄弟姐妹：

$('.box>:first').siblings().css('background-color', 'lime');

框内第一个a元素的所有兄弟姐妹

$('.box>:first(a)').siblings().css('background-color', 'lime');

现在，BIT更复杂，匹配第一个元素的东西：

$('.box>:first').each(function () {
  //if it has a single class we can do this
  var myclass = '.' + $(this).attr('class');
  // use that single class above
  $(this).siblings(myclass).css('background-color', 'blue');

  //find elements with the same tag that are siblings of my element
  $(this).siblings(this.tagName).css('background-color', 'lime');

  //handle multiple classes
  var myclassAll = $(this).attr('class');

  //split the multiple classes, then use it
  var myclassList = myclassAll.split(" ");
  $(this).siblings().each(function () {
    var iam = $(this);// each sibling
    $.each(myclassList, function (i) {
      if (iam.hasClass(myclassList[i])) {
        iam.addClass(myclassList[i] + 'New');//add new class on matches
      }
    });
  });
});

Answer 4

var fc= jQuery(".box>:first-child").eq(0); //is the first child of container
var allE = fc.parent().children(fc.prop("tagName")); //contains all elements with tagname equal to fc's

Answer 5

var first_element = $(".box *:first-child").prop("tagName");
alert( first_element  );

注意＆gt;＆gt;＆gt; *：first-child 它从选择器

获取第一个HTML标记

使用jQuery查找以前未知元素的所有匹配元素

5 个答案: