[JS][DOM] getElementById op een DOM element

[tombo_inc]

ik ben bezig wat in DOM te klooien, en nu vroeg ik mij af of het mogelijk is om de getElementById method van het document object ook te gebruiken op een ander DOM element zoals bijvoorbeeld een div. ik haal namelijk in mijn applicatie een xml bestand op van de server waar ik vervolgens bepaalde delen van nodig heb. nu zou het makkelijk zijn om gewoon via het id van een element door middel van de getElementById functie het betreffende element op te kunnen halen. echter dit wil zo niet lukken omdat de getElementById functie een methode is van document, en niet van het xml object dat je ophaalt. een alternatief is natuurlijk zelf een zoekfunctie te schrijven voor je object, maar daar heb ik vooralsnog geen trek in . ik wil dus graag weten of ik de getElementById functie ook op een willekeurig element toe kan passen, of dat er alternatieve manieren zijn die hetzelfde resultaat opleveren.

[XWB]

JavaScript:

function getNodeValue(obj, tag)
{
    if (obj.getElementsByTagName(tag)[0])
    {
        if (obj.getElementsByTagName(tag)[0].firstChild)
        {
            return obj.getElementsByTagName(tag)[0].firstChild.nodeValue;
        }
    }
    
    return false;
} 

var xmlList = jouwlijst.getElementsByTagName('user'); // <user><naam></naam><leeftijd></leeftijd></user>

for (var i = 0; i < xmlList.length; i++)
{
    var naam = getNodeValue(xmlList[i], 'naam');
    var leeftijd = getNodeValue(xmlList[i], 'leeftijd');
}

Zoiets ?

[tombo_inc]

dit is niet helemaal wat ik bedoel. met jou script haal je de waarde van een bepaalde tag op. wat ik wil is het hele object (als object) inclusief childs. je kan idd met getElementsByTagName een mooie array met alle objecten van 'tag' krijgen, maar dan moet je nog uit zien te vogelen welk element in die array dan het object is dat je nodig hebt.
stel ik heb een x(ht)ml pagina met daarin 5 divs, en ik heb de 4e div nodig. dan zou je in jou geval het 4e array element moeten aanspreken. maar wat nou als iemand de volgorde van de divs verandert in je bron bestand, dan werkt het dus niet meer. als je nu alle divs een id geeft, en op id zoekt net als de getElementsById method dan werkt het altijd ongeacht de volgorde.
het probleem is alleen dat getElementsById (voor zover ik weet) alleen werkt op het document object en niet op bijvoorbeel xml DOM objecten. wat ik me dus afvraag is of het mogelijk is om deze functie wel op andere objecten dan het document object werkend te krijgen. of dat er (behalve zelf een search functie te maken) alternatieve methoden zijn die hetzelfde resultaat opleveren.

[cyberstalker]

Hacku schreef op zondag 29 oktober 2006 @ 21:12:

JavaScript:

function getNodeValue(obj, tag)
{
    if (obj.getElementsByTagName(tag)[0])
    {
        if (obj.getElementsByTagName(tag)[0].firstChild)
        {
            return obj.getElementsByTagName(tag)[0].firstChild.nodeValue;
        }
    }
    
    return false;
} 

var xmlList = jouwlijst.getElementsByTagName('user'); // <user><naam></naam><leeftijd></leeftijd></user>

for (var i = 0; i < xmlList.length; i++)
{
    var naam = getNodeValue(xmlList[i], 'naam');
    var leeftijd = getNodeValue(xmlList[i], 'leeftijd');
}

Zoiets ?

Nee hij bedoelt toch echt getElementById geloof ik.

Ik weet niet of het kan, maar anders is het heel eenvoudig op te lossen met een functie die het document teruggeeft. Heb ik zelf ooit eens gebruikt in een Fx extensie, waar je bij addEventListener callbacks nooit rechtstreeks bij het document kunt komen.

JavaScript:

function get_document(event)
{
    var elm = event.target;
    
    while (elm.nodeName.toLowerCase() != '#document')
    {
        elm = elm.parentNode;
    }
    
    return elm;
}

Ik heb de code maar even voor je opgezocht .

[Rekcor]

http://www.google.com/sea...ntById+javascript&spell=1

Levert onder meer op:

http://www.quirksmode.org/dom/importxml.html

Heb je hier iets aan?

[crisp]

Een ID is in XML gewoon een attribuut en heeft verder geen speciale waarde, derhalve is er ook geen getElementById method voor XML.
Je zou dus inderdaad de XML kunnen parsen naar een (X)HTML-DOM of zelf door alle elementen heenlopen en de ID attribuut-waarden vergelijken.

[tombo_inc]

zo'n vermoeden had ik dus al .
hoe kan ik dan mijn xml naar een (X)HTML-DOM omzetten voordat ik mijn xml in mijn webpagina plak (of stel ik hier een domme vraag)?

[Michali]

Je kunt er een XSLT stylesheet overheen halen om er HTML van te maken.

Beter is echter om gewoon XPath te gebruiken om je elementen te selecteren. Op die manier kun je ieder element met wat voor attribuut dan ook selecteren:

code:

*[@id='blaat']

[tombo_inc]

dat ziet er leuk uit inderdaad, maar ik heb echt nul komma nul verstand van XPath. ik moet me er nog een keer in gaan verdiepen maar ik heb daar op het moment geen tijd voor.
is XPath binnen javascript te gebruiken? ik haal namelijk mijn xml op dmv javascript. de xml zit dus verpakt in objecten binnen javascript en daar worden ze ook verwerkt. ik koppel dmv javascript de juiste nodes aan mijn xhtml document. ik weet dus niet of ik XPath kan gebruiken om de juiste elementen uit mijn xml te selecteren.

*edit:

ik heb net ff snel gezocht en ik ben erachter dat je binnen javascript met de selectNodes() functie op een xmlobject dmv een XPath expressie een xml document kan doorzoeken. (correct me if i'm wrong)

[ Voor 17% gewijzigd door tombo_inc op 01-11-2006 19:44 ]

[Clay]

selectNodes is IE only. in Firefox moet je de evaluate() (niet te verwarren met eval!) hebben. Leuke is dan weer dat selectnodes een soort nodelist teruggeeft, en evaluate een soort iterator. En dan hebben we het nog niet eens over opera of safari dus ik zou het niet doen eigenlijk.

[tombo_inc]

right, das lekker ja.
heb je dan mssn een andere suggestie, behalve zelf een search functie te schrijven.

[Michali]

Ik heb er een utility class voor gemaakt, die de verschillen verbergt:

JavaScript:

var XPath = {
    selectNodes: function(query, contextNode)
    {
        if ( Navigator.IS_IE )
        {
            return contextNode.selectNodes(query);
        }
        else
        {
            var evaluator = new XPathEvaluator();
            var result = evaluator.evaluate(query, contextNode, null, XPathResult.ORDERED_NODE_TYPE, null);
            var nodes = [];
            if ( result )
            {
                while ( true )
                {
                    var node = result.iterateNext();
                    if ( node === null )
                    {
                        break;
                    }
                    nodes.push(node);
                }
            }
            return nodes;
        }
    },
    
    selectSingleNode: function(query, contextNode)
    {
        if ( Navigator.IS_IE )
        {
            return contextNode.selectSingleNode(query);
        }
        else
        {
            var evaluator = new XPathEvaluator();
            var result = evaluator.evaluate(query, contextNode, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
            return result ? result.singleNodeValue : null;
        }
    }
};

Misschien heb je hier wat aan. Alleen IE heeft een eigen manier, de andere browsers voldoen allemaal aan de DOM standaard dacht (hoop) ik.

[ Voor 3% gewijzigd door Michali op 02-11-2006 08:31 ]

[Tsjilp]

opera heeft volgens mij geen XSLT processor, dus die gebruikers sluit je daarmee uit.

je kan toch gewoon doen:

code:

var bla = xmldoc.getElementsByTagName('naam')
for (var i in bla) {
  if(i.id == 'datgene wate je zoekt') {
     return i;
  }
}
return false;

[ Voor 0% gewijzigd door Tsjilp op 02-11-2006 09:49 . Reden: ==, maar dan wel de goeie ]