15

から要素を取得しましdocument.getElementById('the_id')た。次の兄弟を取得して非表示にするにはどうすればよいですか? 私はこれを試しましたが、うまくいきませんでした：

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

Firebug エラーはelem.nextSibling.style is undefined.

4

4 に答える 4

36

これは、Firefox が要素ノード間の空白をテキスト ノードと見なし (IE はそうではない) .nextSibling、要素で使用すると Firefox でそのテキスト ノードが取得されるためです。

次の要素ノードを取得するために使用する関数があると便利です。このようなもの

/* 
   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';
于 2009-05-15T12:31:43.483 に答える
13

Element Traversal APIを見てください。この API は Element ノード間のみを移動します。これにより、次のことが可能になります。

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

したがって、要素以外のノードを取得する可能性があるという nextSibling に固有の問題 (たとえば、空白を保持する TextNode) を回避できます。

于 2013-03-10T12:43:54.663 に答える
2

Firebug エラーは、elem.nextSibling.style が未定義でした。

nextSibling はテキストノードまたはその他のノードタイプになる可能性があるため

do {
   elem = elem.nextSibling;
} while(element && elem.nodeType !== 1); // 1 == Node.ELEMENT_NODE
if(elem) elem.style.display = 'none';
于 2009-05-15T12:32:49.143 に答える
0

次のようなものを使用して、この要素の子をループしてみてください。

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

構文を適切に修正してください。

于 2009-05-15T12:35:58.560 に答える