element.firstChild ist wieder in '<TextNode ...' anstatt ein Objekt in FF

Schrieb ich ein tab-system über einige sehr grundlegende Javascript-und es läuft wie ein Weltmeister im IE 8, FireFox 3, die ich bin, zu kurz kommen. Die pertitent HTML ist wie folgt:

            <div id="tabs">
                <ul class="tabs">
                    <li class="current"><a><span>News</span></a></li>
                    <li><a><span>Videos</span></a></li>
                    <li><a><span>Photos</span></a></li>
                    <li><a><span>Twitter</span></a></li>
                </ul>
            </div>

Dann auf die Seite laden, bekomme ich sank in dieser Methode:

function processTabs(TabContainer, PageContainer, Index) {
var tabContainer = document.getElementById(TabContainer);
var tabs = tabContainer.firstChild;

var tab = tabs.firstChild;
var i = 0;
.... more code }

Den rest des Codes nicht die Materie an diesem Punkt, weil Sie nie aufgerufen wird. tabContainer richtig eingestellt ist, verweisen die div mit der ID tabs. Nun, im Internet Explorer, wenn ich rufe tabContainer.firstChild die variable 'Registerkarten' auf meine UL-und dann der Anruf var tab = tabs.firstChild; Referenzen meine ersten LI. Das problem ist, dass wenn ich Anrufe, tabContainer.firstChild Venkman sagt mir, es wird zurückkehren . Also firefox liest meine Zeilenumbrüche als tatsächliche Kinder innerhalb des div ' s! Mein UL ist eigentlich das zweite Kind in der childNodes-Auflistung!

Gibt es irgendeine Möglichkeit dieses Problem zu beheben?

Dank!

InformationsquelleAutor der Frage dparsons | 2010-02-19

  1. 24

    Sollten Sie überspringen die TextNodes eine einfache Funktion kann Ihnen helfen:

    function getFirstChild(el){
  var firstChild = el.firstChild;
  while(firstChild != null && firstChild.nodeType == 3){ //skip TextNodes
    firstChild = firstChild.nextSibling;
  }
  return firstChild;
}

    Verwendung:

    var tabContainer = document.getElementById(TabContainer);
var tabs = getFirstChild(tabContainer);

    InformationsquelleAutor der Antwort CMS

  2. 11

    Können Sie node.firstElementChild zu ignorieren führenden text, oder benutzen Sie eine Bibliothek wie jQuery, die kümmert sich um diese.

    InformationsquelleAutor der Antwort Max Shawabkeh

  3. 2

    Mit einem Auge auch auf die Effizienz, diese Funktion gibt firstChild element-node el

    function firstChildElement(el)
{
    el = el.firstChild;
    while (el && el.nodeType !== 1)
       el = el.nextSibling;
    return el;
}

    InformationsquelleAutor der Antwort Marco Demaio

  4. 0

    Ich würde empfehlen, jemand versucht, die DOM in javascript benutzen Sie eine Bibliothek wie jquery. Es wird Ihr Leben viel einfacher.

    Könntest du dann schreiben Sie die JS Funktion als Brache:

    function processTabs(TabContainer, PageContainer, Index) {
    var tabContainer = document.getElementById(TabContainer);

    //jquery used to find all the <li> elements
    var tabs = $(tabContainer).filter('li');

    //use the jquery get( index ) function to retrieve the first tab
    var tab = tabs.get(0);
    var i = 0;
    .... more code
}

    InformationsquelleAutor der Antwort Rouan van Dalen

  5. 0

    Können Sie versuchen, 

    document.getElementById(TabContainer).firstElementChild;

    statt firstChild

    InformationsquelleAutor der Antwort B.Nabeih

Schreibe einen Kommentar