Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.11.2010, 03:03
Кандидат Javascript-наук
Отправить личное сообщение для TicTac Посмотреть профиль Найти все сообщения от TicTac
 
Регистрация: 07.09.2010
Сообщений: 133

Как выбрать 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 набирает лишние

Код можно не писать, просто помочь морально - идеей.
Ответить с цитированием
  #2 (permalink)  
Старый 16.11.2010, 07:18
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,597

размышление на тему )))
<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>
Ответить с цитированием
  #3 (permalink)  
Старый 16.11.2010, 08:37
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 12,782

Сообщение от TicTac
getElementsByTagName('li') выбирает все, а мне нужны только два li <li>..Милан..</li> и <li>..Арсенал..</li>.
Т.е. саму разметку ты менять не можешь? Например добавить

name='firstLi'
Ответить с цитированием
  #4 (permalink)  
Старый 16.11.2010, 09:09
Кандидат Javascript-наук
Отправить личное сообщение для TicTac Посмотреть профиль Найти все сообщения от TicTac
 
Регистрация: 07.09.2010
Сообщений: 133

рони, а без jquery нельзя сделать или глупо?

ksa, все верно, не хотелось бы завязывать id и по ним работать хотелось бы универсальное чтобы само определяло. Ну и на javascript only.

Последний раз редактировалось TicTac, 16.11.2010 в 09:23.
Ответить с цитированием
  #5 (permalink)  
Старый 16.11.2010, 09:16
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 12,782

Сообщение от TicTac
хотелось бы универсальное чтобы само определяло
Таки дай "верхним"
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')

Сообщение от TicTac
Ну и на javascript only.
Дык онлиней некуда...
Ответить с цитированием
  #6 (permalink)  
Старый 16.11.2010, 12:59
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,597

Сообщение от TicTac
Ну и на javascript only
для меню любой вложенности
<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>
Ответить с цитированием
  #7 (permalink)  
Старый 16.11.2010, 15:09
Кандидат Javascript-наук
Отправить личное сообщение для TicTac Посмотреть профиль Найти все сообщения от TicTac
 
Регистрация: 07.09.2010
Сообщений: 133

ksa,забыл про нейм, нужнос попробовать, сасиб

рони, ухты, будем вечером что делать разобраться как это работает..
Ответить с цитированием
  #8 (permalink)  
Старый 30.04.2013, 10:55
Новичок на форуме
Отправить личное сообщение для m0nya Посмотреть профиль Найти все сообщения от m0nya
 
Регистрация: 22.06.2010
Сообщений: 6

$("ul.rootlist > li a")....
http://stackoverflow.com/questions/9...ents-in-jquery
Ответить с цитированием
  #9 (permalink)  
Старый 30.04.2013, 13:05
Аватар для zilker
Профессор
Отправить личное сообщение для zilker Посмотреть профиль Найти все сообщения от zilker
 
Регистрация: 30.07.2011
Сообщений: 189

document.querySelectorAll('#menu > li');
Ответить с цитированием
  #10 (permalink)  
Старый 02.05.2013, 21:05
Профессор
Отправить личное сообщение для nikita.mmf Посмотреть профиль Найти все сообщения от nikita.mmf
 
Регистрация: 01.02.2010
Сообщений: 364

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" )
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как сделать выпадающий список, чтобы второй зависил от значения первого???? zsaz jQuery 2 16.07.2010 20:12
Как поменять местами элементы в дереве элемента родителя? rar11 Events/DOM/Window 8 01.04.2009 18:53
Как удалить все пустые элементы UL smashercosmo Events/DOM/Window 13 25.02.2009 09:03
Подскажите как сделать меню как на mail.ru? dakdak Элементы интерфейса 3 02.01.2009 19:43
Раскрывающееся меню, как переставить на другую сторону? Resager Events/DOM/Window 8 22.08.2008 21:56