有没有办法检测父元素内的元素?

时间:2010-06-14 08:33:49

标签: jquery jquery-selectors

我想检测父元素中的所有元素,并且仍然检查子元素是否具有子元素并检测它们。

例如:

<div id="first">
     <div id='second1'></div>
     <div id='second2'>
          <div id='third1'></div>
          <div id='third2'>
               <div id='fourth1'></div>
               <div id='fourth2'></div>
          </div>
          <div id='third3'></div>
     </div>
     <div id='second3'></div>
     <div id='second4'></div>
</div>

我想知道#first中所有id的列表,并检查每个子节点是否有它的子节点,并保持此状态,直到我有完整的所有元素列表。

我希望此列表在此模式中的数组中

array (
"body"=> {
           "first" => "second1", "second2" .............
         }
);

2 个答案:

答案 0 :(得分:2)

试试这个:

$("#first *")

您可以使用children方法获取孩子

$("#first").children()

添加一些递归

function recursion ( elem, arr )
{
   var id = $(elem).attr('id');
   if ( id )
   {
     var children = arr[ id  ] = {};
     $(elem).children().each( function(){ recursion(this, children ) });
   }
}

var elements = {};
recursion ( $("#first"), elements );
console.log ( JSON.stringify( elements ) );

你会得到

 {"first":{"second1":{},"second2":{"third1":{},"third2":{"fourth1":{},"fourth2":{}},"third3":{}},"second3":{},"second4":{}}}

http://jsbin.com/udaje4/edit

答案 1 :(得分:0)

另一种方法是:

var childrens = {};
$('#first').children().each(function() {
    id = $(this).attr('id');

    if($('#'+id).children().size() > 0) {
        $('#'+id).children().each(function() {
            childrens[id] = {}
            childrens[id][$(this).attr('id')] = {};
        });
    } else childrens[$(this).attr('id')] = {};
});

alert(JSON.stringify(childrens));