Frage zu document.getElementById

[frage]

Hallo an alle!

habe eine wahrscheinlich sehr dämliche Frage, aber habe im Internet  nichts dazu gefunden, und zwar: Wie kann man mit Hilfe der document.getElementById-Funktion auf den Wert eines Elementes zugreifen? Ich habe z.B. folgendes <div id="1">das möchte ich haben</div>. Wie kann ich den Text "das möchte ich haben" über eine ID rausfinden und in eine Variable speichern? Vielen lieben Dank!

[Tobias Kloth]

Hallo,

Wie kann man mit Hilfe der document.getElementById-Funktion auf den Wert eines Elementes zugreifen?

vielleicht mit innerHTML? (-> document.getElementById('foo').innerHTML)

Ich habe z.B. folgendes <div id="1">das möchte ich haben</div>.

»1« ist keine gültige ID (IDs müssen mit einem Buchstaben beginnen).

Grüße aus Nürnberg
Tobias

[romy]

Hi ,

habe eine wahrscheinlich sehr dämliche Frage, aber habe im Internet  nichts dazu gefunden, und zwar: Wie kann man mit Hilfe der document.getElementById-Funktion auf den Wert eines Elementes zugreifen? Ich habe z.B. folgendes <div id="1">das möchte ich haben</div>. Wie kann ich den Text "das möchte ich haben" über eine ID rausfinden und in eine Variable speichern?

über die Option .Value ???

z.B.
var test = document.getElementById("1").Value

ciao
romy

[Tobias Kloth]

Hallo romy,

var test = document.getElementById("1").Value

nö, ein »alert(test);« gibt hier »undefined« aus, funktionieren könnte es aber auch mit http://de.selfhtml.org/javascript/objekte/node.htm#data.

Grüße aus Nürnberg
Tobias

[JürgenB]

Hallo,

var test = document.getElementById("1").Value

var test = document.getElementById("d1").firstChild.value

Gruß, Jürgen

[Siechfred]

Hallo Jürgen.

var test = document.getElementById("d1").firstChild.value

Wenn ich mich nicht irre, wäre es so richtig:
var test = document.getElementById("d1").firstChild.nodeValue;

Oder?

Freundschaft!
Siechfred

[JürgenB]

Hallo,

Wenn ich mich nicht irre, wäre es so richtig:
var test = document.getElementById("d1").firstChild.nodeValue;

stimmt, value nimmt man bei Formularelementen.

Gruß, Jürgen

[Siechfred]

Hallo.

Wie kann man mit Hilfe der document.getElementById-Funktion auf den Wert eines Elementes zugreifen?

getElementById liefert dir eine Referenz auf das entsprechende HTML-Element, danach richtet sich, welche Eigenschaften dir zur Verfügung stehen:

http://de.selfhtml.org/javascript/objekte/htmlelemente.htm

Du wirst sehen, eine Eigenschaft zum Auslesen des Inhaltes gibt es nur für Formularelemente. Zugriff auf den Textinhalt anderer Elemente (so es welchen gibt) erhältst du sonst über das nodes-Objekt:

http://de.selfhtml.org/javascript/objekte/node.htm#data

Für den IE (und neuere Operas) kannst du dich auch der Eigenschaften innerHTML und innerText des all-Objektes bedienen:

http://de.selfhtml.org/javascript/objekte/all.htm

Freundschaft!
Siechfred

[wahsaga]

hi,

Für den IE (und neuere Operas) kannst du dich auch der Eigenschaften innerHTML und innerText des all-Objektes bedienen:

http://de.selfhtml.org/javascript/objekte/all.htm

eigentlich alle neueren browser können mit .innerHTML auch dann "etwas anfangen", wenn man zuvor mit getElementByXY auf das element referenziert (und ich nehme an, mit .innerText verhält es sich ähnlich).

"sauber" ist diese vermischung von DOM- und nicht-Dom-Methoden/-eigenschaften aber natürlich nicht so wirklich ...

gruß,
wahsaga

[Siechfred]

Hallo wahsaga.

"sauber" ist diese vermischung von DOM- und nicht-Dom-Methoden/-eigenschaften aber natürlich nicht so wirklich ...

Naja, streng genommen ist es nur ein anderes (mittlerweile nicht mehr ganz so proprietäres) DOM-Modell.

Freundschaft!
Siechfred

[molily]

Hallo,

eigentlich alle neueren browser können mit .innerHTML auch dann "etwas anfangen", wenn man zuvor mit getElementByXY auf das element referenziert (und ich nehme an, mit .innerText verhält es sich ähnlich).

Mozilla kann z.B. kein innerText, und anstatt diese nützliche Eigenschaft zu übernehmen, implementiert man lieber das äquivalente textContent aus DOM 3 Core.

Allerdings kann man innerText mit textContent im Mozilla mit den Prototypen der DOM-Interfaces nachbauen:

if (typeof HTMLElement != "object") {
    HTMLElement.prototype.innerText getter = function() {
        return this.textContent;
    }
    HTMLElement.prototype.innerText setter = function (str) {
        this.textContent = str;
    }
}

Ich weiß aber nicht, ob die Serialisierungsregeln bei textContent denen von innerText entsprechen (bzw. bei innerText sind sie soweit ich weiß nicht formal definiert).

Mathias

[frage]

Hallo, vielen lieben Dank für die Hilfe!! Es funktioniert auch wunderbar, aber leider habe ich manchmal folgende Struktur:
<div id="bla"><img../>text</div>

und in diesem Fall bekomme ich "undefined" bei firstChild.data :( Wie bekomme ich in diesem Fall nur text? Vielen Dank! :)

[wahsaga]

hi,

<div id="bla"><img../>text</div>

und in diesem Fall bekomme ich "undefined" bei firstChild.data :(

natürlich, das erste kind ist hier ja ein img, und das hat keine data.

Wie bekomme ich in diesem Fall nur text?

wenn du dich an siehfreds hinweis auf innerHTML aus https://forum.selfhtml.org/?t=90695&m=544226 hältst, solltest du "<img../>text" bekommen - da müsstet du jetzt nur noch mit den string-funktionen alles, was innerhalb von "tags" steht, rausschneiden ...

ansonsten beschäftige dich mehr mit dem DOM, um zu schauen, wie du den _typ_ der kindelemente zunächst prüfst, bevor du dich entscheidest, auf eine eigenschaft wie .data zuzugreifen.

gruß,
wahsaga

[Siechfred]

Hallo.

<div id="bla"><img../>text</div>
und in diesem Fall bekomme ich "undefined" bei firstChild.data

Logisch, es ist ja auch kein Textknoten, dies ist erst der zweite :)
Was du brauchst, ist ein Array aller Kindknoten des Elementes, dabei hilft dir childNodes:
http://de.selfhtml.org/javascript/objekte/node.htm#child_nodes

Dieses durchläufst du, bis du einen Textknoten findest:
http://de.selfhtml.org/javascript/objekte/node.htm#node_type

Dann hast du auch mittels data Zugriff auf den Inhalt.

Freundschaft!
Siechfred

[Thomas Meinike]

Hallo,

funktioniert auch wunderbar, aber leider habe ich manchmal folgende Struktur:
<div id="bla"><img../>text</div>

und in diesem Fall bekomme ich "undefined" bei firstChild.data :( Wie bekomme ich in diesem Fall nur text?

z.B. so:

document.getElementById("bla").firstChild.nextSibling.data

oder

document.getElementById("bla").lastChild.data

oder

document.getElementById("bla").childNodes.item(1).data

MfG, Thomas

[frage]

Vielen, vielen Dank an alle!! Eure vielen Tipps haben mir sehr geholfen, danke! :)