Скрыть элемент next sibling с помощью Javascript

У меня есть элемент, захваченный с document.getElementById('the_id'). Как я могу получить следующего брата и скрыть его? Я пробовал это, но это не сработало:

elem.nextSibling.style.display = 'none';

Ошибка Firebug была elem.nextSibling.style is undefined.

Ответы

Ответ 1

потому что Firefox считает, что пробел между узлами элементов является текстовыми узлами (тогда как IE не работает), и поэтому использование .nextSibling в элементе получает этот текст node в Firefox.

Полезно иметь функцию для использования следующего элемента node. Что-то вроде этого

/* 
   Credit to John Resig for this function 
   taken from Pro JavaScript techniques 
*/
function next(elem) {
    do {
        elem = elem.nextSibling;
    } while (elem && elem.nodeType !== 1);
    return elem;        
}

то вы можете сделать

var elem = document.getElementById('the_id');
var nextElem = next(elem); 

if (nextElem) 
    nextElem.style.display = 'none';

Ответ 2

Взгляните на API обхода элементов, этот API перемещается только между узлами Element. Это позволяет следующее:

elem.nextElementSibling.style.display = 'none';

И, таким образом, избегает проблемы, присущей nextSibling потенциального получения неэлементных узлов (например, TextNode, содержащего пробелы)

Ответ 3

Ошибка Firebug была elem.nextSibling.style undefined.

поскольку nextSibling может быть текстовым node или другим node типом

do {
   elem = elem.nextSibling;
} while(element && elem.nodeType !== 1); // 1 == Node.ELEMENT_NODE
if(elem) elem.style.display = 'none';

Ответ 4

Попробуйте выполнить цикл через дочерние элементы этого элемента, используя что-то вроде:

var i=0;
(foreach child in elem)
{
   if (i==0)
   {
     document.getElementByID(child.id).style.display='none';
    }
}

Просим внести соответствующие изменения в синтаксис.