Как выбрать li элементы из первого уровня меню
Есть такое меню
<ul id="menu"> <li><a href="#">Милан</a> <ul class="submenu"> <li><a href="#">Пато</a></li> <li><a href="#">Пирло</a></li> <li><a href="#">Ибрагимович</a></li> </ul> </li> <li><a href="#">Арсенал</a> <ul> <li><a href="#">Фабрегас</a></li> <li><a href="#">Уолкот</a></li> <li><a href="#">Росицки</a></li> <li><a href="#">Фабиански</a></li> </ul> </li> </ul> как из него выбрать только li элементы первого уровня, если использовать getElementsByTagName('li') выбирает все, а мне нужны только два li <li>..Милан..</li> и <li>..Арсенал..</li>. А если через childNodes набирает лишние Код можно не писать, просто помочь морально - идеей. |
размышление на тему )))
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $('#menu li a').next().css('display', 'none'); $('#menu li a').bind("click", function () { $(this).next().toggle();}) }) </script> <ul id="menu"> <li><a href="#">Милан</a> <ul class="submenu"> <li><a href="#">Пато</a></li> <li><a href="#">Пирло</a></li> <li><a href="#">Ибрагимович</a></li> </ul> </li> <li><a href="#">Арсенал</a> <ul class="submenu"> <li><a href="#">Фабрегас</a></li> <li><a href="#">Уолкот</a></li> <li><a href="#">Росицки</a></li> <li><a href="#">Фабиански</a></li> </ul> </li> </ul> |
Цитата:
name='firstLi' |
рони, а без jquery нельзя сделать или глупо?
ksa, все верно, не хотелось бы завязывать id и по ним работать хотелось бы универсальное чтобы само определяло. Ну и на javascript only. |
Цитата:
name='firstLi' <ul id="menu"> <li name='firstLi'><a href="#">Милан</a> <ul class="submenu"> <li><a href="#">Пато</a></li> <li><a href="#">Пирло</a></li> <li><a href="#">Ибрагимович</a></li> </ul> </li> <li name='firstLi'><a href="#">Арсенал</a> <ul> <li><a href="#">Фабрегас</a></li> <li><a href="#">Уолкот</a></li> <li><a href="#">Росицки</a></li> <li><a href="#">Фабиански</a></li> </ul> </li> </ul> и потом пользуйся document.getElementsByTagName('li').getElementsByName('firstLi') Цитата:
|
Цитата:
<ul id="menu"> <li><a href="#">Милан</a> <ul > <li><a href="#">Пато</a></li> <li><a href="#">Пирло</a></li> <li><a href="#">Ибрагимович</a></li> </ul> </li> <li><a href="#">Арсенал</a> <ul > <li><a href="#">Фабрегас</a></li> <li><a href="#">Уолкот</a></li> <li><a href="#">Росицки</a></li> <li><a href="#">Фабиански</a></li> <li><a href="#">Второй состав</a> <ul > <li><a href="#">Первый</a></li> <li><a href="#">Второй</a></li> <li><a href="#">Третий</a></li> <li><a href="#">Запасные</a> <ul > <li><a href="#">Нападающий</a></li> <li><a href="#">Защитник</a></li> <li><a href="#">Вратарь</a></li> </ul> </li> </ul> </li> </ul> </li> </ul> <script type="text/javascript"> for (var menu = document.getElementById("menu"), uls = menu.getElementsByTagName("ul"), i = 0; i < uls.length; i++) { uls[i].style.display = "none"; var a = uls[i].parentNode.getElementsByTagName("a")[0]; a.style.backgroundColor = "#00FF7F"; a.onclick = function (b) { return function () { uls[b].style.display = uls[b].style.display ? "" : "none"; var ulss= uls[b].getElementsByTagName('ul') for (var k=0; k<ulss.length; k++) { ulss[k].style.display='none' } return false } }(i) }; </script> |
ksa,забыл про нейм, нужнос попробовать, сасиб
рони, ухты, будем вечером что делать разобраться как это работает.. |
$("ul.rootlist > li a")....
http://stackoverflow.com/questions/9...ents-in-jquery |
document.querySelectorAll('#menu > li'); |
function getChildren( parent, tag ) { var children = []; if ( tag ) tag = tag.toLowerCase(); if ( typeof parent === "string" ) { parent = document.getElementById( parent ); } for ( var child = parent && parent.firstChild; child; child = child.nextSibling ) { if ( child.nodeType === 1 && (!tag || child.nodeName.toLowerCase() === tag ) children.push( child ); } return children; } getChildren( "menu", "li" ) |
Часовой пояс GMT +3, время: 15:35. |