Alle Elemente mit bestimmten Tag finden.

[mbi]

Ich habe auf einer Seite ein online-Hilfe eingebaut. Sobald man über ein Element geht, wird per onMouseOver eine Funktion gestartet, die den Titel-Tag dieses Elements ausliest, und den Inhalt per innerHTML in eine entsprechende DIV schreibt. Allerdings muss ich dafür jedem einzelnen Element dieses onmousover sowie ein onmouseout manuell mitgeben.

Beispiel:
<a href="#" title="Klicken Sie hier um dies und das zu machen" onMouseOver="zeigeHilfe(this)" onMouseOut="zeigeHilfe('kein Text')">Link</a>
<div id="hilfe"><!-- Hier steht dann der Hilfetext --></div>

Jetzt habe ich mir überlegt, ob es nicht möglich ist, dass man hier automatisiert. Man müsste per DOM die ganze Seite nach Elementen mit dem TITLE-Tag durchsuchen und diese dann mit den Events versorgen.
So müsste man nurnoch den Title für die Elemente setzen, der rest würde von alleine passieren.

Kann man - und wenn wie - so etwas umsetzen?!

[lina-]

moin mbi :)

Ich bin mir grad nicht so sicher, ob du nun tatsächlich den Title-Tag meinst oder doch eher das Title-Attribut.

Werde dir darüber im Klaren und dann kannst du dir mal die Methoden getElementById,
getElementByName und getElementByTagName anschauen.

Wie du den Eventhandler am besten zuweist, findest du im Archiv. Dort hat Struppi eine sehr gute Lösung parat :)

liebe Grüße aus Berlin
lina-

[Felix Riesterer]

Liebe(r) mbi,

Jetzt habe ich mir überlegt, ob es nicht möglich ist, dass man hier automatisiert. Man müsste per DOM die ganze Seite nach Elementen mit dem TITLE-Tag durchsuchen

guter Ansatz! Mein Vorschlag wäre jedoch, dass Du lieber eine bestimmte CSS-Klasse zuweist, die Du per Javascript findest, um dem Element dann den Eventhandler (onmousemove/onmouseout/onclick etc.) zu geben.

var meineCSSKlasse = "title-bewaffnet";  
var alleElemente = document.getElementsByTagName("*");  
  
// Alle Elemente durchsuchen...  
for (var i = 0; i < alleElemente.length) {  
  
    // Element hat eine CSS-Klasse? Wenn ja, ist es die gesuchte?  
    if (alleElemente[i].className && alleElemente[i].className == meineCSSKlasse) {  
  
        // Ist das title-Attribut überhaupt gefüllt?  
        if (alleElemente[i].title && alleElemente[i].title.value != "") {  
  
            // Title-Inhalt nehmen und etwas damit machen  
            var titleInhalt = alleElemente[i].title.value;  
            // hier weitere Anweisungen!  
        }  
    }  
}

Liebe Grüße aus Ellwangen,

Felix Riesterer.

[rfb]

Moin

[code lang=javascript]var meineCSSKlasse = "title-bewaffnet";
var alleElemente = document.getElementsByTagName("*");

ich bin mir jetzt nicht sicher ob * klappt.
Aber sinnvoller wäre sicherlich nur tags innerhalb des body anzusprechen, also

var alleElemente = document.getElementsByTagName("body")[0].getElementsByTagName("*");

for (var i = 0; i < alleElemente.length) {

i++ fehlt, da sonst der Index nie anwächst:
for (var i = 0; i < alleElemente.length; i++) {

// Element hat eine CSS-Klasse? Wenn ja, ist es die gesuchte?
    if (alleElemente[i].className && alleElemente[i].className == meineCSSKlasse) {

hier vielleicht besser indexOf() nutzen, falls ein Tag mehrere Klassen hat

if (alleElemente[i].title && alleElemente[i].title.value != "") {

value gibts hier nicht, also
if (... alleElemente[i].title != "")

allerdings erachte ich es als sinnvoller einfach gleich nach der Existenz des title-Attributs zu fragen statt der Klassenzuweisung.

Gruß
rfb

[mbi]

Hallo,

ha, so einfach ist das! Vielen Dank für die vielen und schnellen Antworten, damit kann ich jetzt prima weiterarbeiten! Hat mir shr geholfen!

Marc

[JürgenB]

Hallo mbi,

ich vermute wie die anderen, dass Du das Title-Attribut meinst.
Kopier mal

javascript:var e=document.getElementsByTagName("*");alert(e.length);for(var i=0;i<e.length;i++) if(e[i].title)alert(e[i].title);

in die Adresszeile deines Browsers. Vieleicht ist es das, was Du suchst.

Gruß, Jürgen