nicht angemeldet
firstChild
0 
MudGuard
0 0 
Gernot Back
0 0 Gernot Back
0 0 Gernot Back
0
0
0 Gernot Back
firstChild
Hallo,
ich habe die folgende Listennavigation;
<ul id="nav">
<li>Dummy Link Dummy Link
<ul>
<li>Subpunkt 1.1</li>
<li>Subpunkt 1.2</li>
<li>Subpunkt 1.3</li>
</ul>
</li>
<li>Dummy Link Dummy Link
<ul>
<li>Subpunkt 1.1</li>
<li>Subpunkt 1.2</li>
<li>Subpunkt 1.3</li>
</ul>
</li>
</ul>
und ich muus den Link: "Dummy Link Dummy Link" der über <ul></ul>
difeniert ist, beim öffnen der Liste eine andere Farbe z.B "red" eine andere Schriftgröße z.B. "bold" geben.
Ich habe es mit "ul[0].firstChild.style.color='red';" versucht, aber es funktioniert nicht und es greift auf Subpunkt 1.1 was ich eigentlich nicht will.
Ich wäre für einen Tipp oder Lösung sehr Dankbar
Der Code :
<html>
<script type="text/javascript">
function displaySubNav(li, display) {
var ul = li.getElementsByTagName('ul');
if (ul && ul[0])
ul[0].style.display = display;
ul[0].firstChild.style.color='red';
}
function hideNavigation() {
var nav = document.getElementById('nav');
var item = nav.firstChild;
while (item) {
if (item.tagName && item.tagName.toLowerCase() == "li") {
displaySubNav(item, "none");
}
item = item.nextSibling;
}
}
function showNavigation(li) {
hideNavigation();
displaySubNav(li, "block");
}
</script>
<body onload="hideNavigation()">
<ul id="nav">
<li><a href="#" onclick="showNavigation(this.parentNode);">Dummy Link Dummy Link</a>
<ul>
<li>Subpunkt 1.1</li>
<li>Subpunkt 1.2</li>
<li>Subpunkt 1.3</li>
</ul>
</li>
<li><a href="#" onclick="showNavigation(this.parentNode);">Dummy Link Dummy Link</a>
<ul>
<li>Subpunkt 1.1</li>
<li>Subpunkt 1.2</li>
<li>Subpunkt 1.3</li>
</ul>
</li>
</body>
</html>
-
Hi,
<ul id="nav">
<li>Dummy Link Dummy Link
<ul>
<li>Subpunkt 1.1</li>Ich habe es mit "ul[0].firstChild.style.color='red';" versucht, aber es funktioniert nicht und es greift auf Subpunkt 1.1 was ich eigentlich nicht
var ul = li.getElementsByTagName('ul');Du holst hier alle ul, die im übergebenen li (das li, in dem der Link selbst steht) stehen.
Das ist genau ein ul, nämlich das mit den Subpunkten.ul[0].firstChild.style.color='red';
Vom ersten dieser ul (die Liste mit den Subpunkten) färbst Du dann das erste Kind (li).
Willst Du vielleicht das firstChild (also den Link) des li färben, das als Parameter übergeben wird?cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
-
Hi,
Willst Du vielleicht das firstChild (also den Link) des li färben, das als Parameter übergeben wird?
ja, das willl ich. Das firstChild (den Link: Dummy Link Dummy Link)
Gruß
Nadir
-
Hi,
Willst Du vielleicht das firstChild (also den Link) des li färben, das als Parameter übergeben wird?
ja, das willl ich. Das firstChild (den Link: Dummy Link Dummy Link)Dann tu das doch auch.
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
-
Hi,
Dann tu das doch auch.
Ich habe mich evtl. nicht klar ausgedruckt.
Nur der erste: "Dummy Link Dummy Link" soll rot gefärbt werde, aber die anderen drei die darunter sind nicht.
Gruß
Nadir-
Hi,
Ich habe mich evtl. nicht klar ausgedruckt.
nein, Du hast uns sehr klar rüberbringen können, welches Ziel Du anstrebst. Das einzige, was uns nicht klar ist, ist wo nun eigentlich Dein Problem liegt.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi,
nein, Du hast uns sehr klar rüberbringen können, welches Ziel Du anstrebst. Das einzige, was uns nicht klar ist, ist wo nun eigentlich Dein Problem liegt.
Andres gesagt, wie kann ich den Link:
<ul>
<li>DUMMY LINK DUMMY LINK <-- dieser hier --!>
<ul>
<li>Subpunkt 1.1</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.2</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.3</li> <-- nicht dieser hier --!>
</ul>
</li>
<li>Dummy Link Dummy Link <-- dieser hier --!>
<ul>
<li>Subpunkt 1.1</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.2</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.3</li> <-- nicht dieser hier --!>
</ul>
</li>
</ul>ansprechen oder wie kann ich ihm mit der Eigenschaft "firstChild"
eine andere Farbe übergeben, wenn die Liste aufgeklappt ist.Gruß
Nadir-
Hi,
<ul>
<li>DUMMY LINK DUMMY LINK <-- dieser hier --!>Ich wiederhole meine Frage aus meiner ersten Antwort:
Willst Du vielleicht das firstChild (also den Link) des li färben, das als Parameter übergeben wird?
Das hast Du mit ja beantwortet.Wo ist also Dein Problem?
Du hast das li, weißt, daß der Link das firstChild ist, kannst diesem also die Formatierung zuweisen.cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
-
Hi,
Du hast das li, weißt, daß der Link das firstChild ist, kannst diesem also die Formatierung zuweisen.
Ja das ist richtig und es funktioniert.
Aber es werden alle "li.firstChild" rot gefärbt. Ich will aber nur das firstChild der geöffneten Menü bzw. Liste.Gruß
Nadir-
Hi,
Aber es werden alle "li.firstChild" rot gefärbt.
es gibt nur ein li.firstChild, und das sprichst Du gar nicht an.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi,
es gibt nur ein li.firstChild
Nein, die Navi besteht aus mehreren Menüs:
<ul>
<li>DUMMY LINK DUMMY LINK <-- dieser hier firstChild --!>
<ul>
<li>Subpunkt 1.1</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.2</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.3</li> <-- nicht dieser hier --!>
</ul>
</li>
<li>Dummy Link Dummy Link <-- dieser hier firstChild --!>
<ul>
<li>Subpunkt 1.1</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.2</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.3</li> <-- nicht dieser hier --!>
</ul>
</li>
<li>DUMMY LINK DUMMY LINK <-- dieser hier firstChild --!>
<ul>
<li>Subpunkt 1.1</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.2</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.3</li> <-- nicht dieser hier --!>
</ul>
</li>
<li>Dummy Link Dummy Link <-- dieser hier firstChild --!>
<ul>
<li>Subpunkt 1.1</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.2</li> <-- nicht dieser hier --!>
<li>Subpunkt 1.3</li> <-- nicht dieser hier --!>
</ul>
</li>
</ul>Gruß
Nadir-
Hi,
es gibt nur ein li.firstChild
Nein, die Navi besteht aus mehreren Menüs:bitte wiederhole nicht ständig die selben Codes, die wir schon zur Genüge kennen.
<li>DUMMY LINK DUMMY LINK <-- dieser hier firstChild --!>
<li>Dummy Link Dummy Link <-- dieser hier firstChild --!>
<li>DUMMY LINK DUMMY LINK <-- dieser hier firstChild --!>[...]
Ja, aber für jedes gegebene li gibt es nur ein firstChild. Warum gehst Du eigentlich nur auf die unwesentlichen Dinge einer Antwort ein? So wirst Du nie zu einem Ergebnis kommen.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi,
bitte wiederhole nicht ständig die selben Codes, die wir schon zur Genüge kennen.
Dachte ich mir ;-) geht klar man.
Danke für den Hinweiß
Nadir
-
-
-
-
-
-
Hi,
ergänzend zu MudGuards Antwort:
wie kann ich ihm mit der Eigenschaft "firstChild"
Warum bestehst Du so dringend auf die Verwendung von firstChild? Ich habe Dir in meiner ersten Antwort einen weitaus besseren Ansatz genannt.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes
-
-
-
-
-
-
-
Hi,
und ich muus den Link: "Dummy Link Dummy Link" der über <ul></ul>
difeniert ist, beim öffnen der Liste eine andere Farbe z.B "red" eine andere Schriftgröße z.B. "bold" geben.mache dies mit CSS; es gibt keinen Grund, Layout-Informationen im Programmcode unterzubringen. Weise dem <li>-Element eine Klasse wie z.B. "opened" zu.
Ich habe es mit "ul[0].firstChild.style.color='red';" versucht, aber es funktioniert nicht und es greift auf Subpunkt 1.1 was ich eigentlich nicht will.
Das erste Kind des <ul> ist ein komplettes <li>. Du suchst das <a>, welches sich in jenem <li> befindet, welches obiges <ul> enthält.
Deaktiviertes JavaScript hast Du beachtet?
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes -
Hallo Nadir,
Hallo,
<ul id="nav">
<li>Dummy Link Dummy Link
<ul>
<li>Subpunkt 1.1</li>
<li>Subpunkt 1.2</li>
<li>Subpunkt 1.3</li>
</ul>
(...)
und ich muus den Link: "Dummy Link Dummy Link" der über <ul></ul>
difeniert ist, beim öffnen der Liste eine andere Farbe z.B "red" eine andere Schriftgröße z.B. "bold" geben.<li><a href="#" onclick="[code lang=javascript]showNavigation(this.parentNode);this.style.color='red';this.style.fontWeight='bold'">Dummy Link Dummy </a>[/code]Eleganter wäre es freilich, wenn du der Funktion showNavigation() nur this als Parameter übergeben würdest und innerhalb der Funktion selber dann auf den parentNode bzw die Style-Eigenschaften des übergebenen Obkjekts. Dort wäre es auch leichter eine If-Else-Abfrage einzubauen, die den Link nur dann in rot und fett umfärbt, wenn aufgeklappt wird und ansonsten (wenn zugeklappt wird) in den Normalzustand zurückversetzt, was du ja sicherlich möchtest.
Gruß Gernot
-
Hi,
<li><a href="#" onclick="[code]showNavigation(this.parentNode);this.style.color='red';this.style.fontWeight='bold'">Dummy Link Dummy </a>[/code]nicht gut.
Eleganter wäre es freilich, wenn du der Funktion showNavigation() nur this als Parameter übergeben würdest
Nein, ich finde es schon recht elegant, genau das abzuliefern, was gemeint ist. Zumal der JavaScript-Code überhaupt keine Referenz auf den Link benötigt.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hallo Cheatah,
Eleganter wäre es freilich, wenn du der Funktion showNavigation() nur this als Parameter übergeben würdest
Nein, ich finde es schon recht elegant, genau das abzuliefern, was gemeint ist. Zumal der JavaScript-Code überhaupt keine Referenz auf den Link benötigt.
Meinst du denn, dass mein Vorschlag nicht im gemeinten Sinne funktioniert? Vielleicht habe ich ja Nadirs Anliegen nicht richtig verstanden.
Gruß Gernot
-
Hi,
Meinst du denn, dass mein Vorschlag nicht im gemeinten Sinne funktioniert?
doch, das tut er.
Vielleicht habe ich ja Nadirs Anliegen nicht richtig verstanden.
Du hast nur vergessen, dass gerade Anfänger nur schwer bewerten können, was ihr Anliegen eigentlich ist. Das von Nadir beispielsweise ist nicht das, was er beschrieben hat. Ich halte es für falsch, ja sogar für gefährlich, einfach nur lösende Antwort zu geben.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hallo Cheatah,
Du hast nur vergessen, dass gerade Anfänger nur schwer bewerten können, was ihr Anliegen eigentlich ist. Das von Nadir beispielsweise ist nicht das, was er beschrieben hat. Ich halte es für falsch, ja sogar für gefährlich, einfach nur lösende Antwort zu geben.
Das habe ich so wie ich das gemacht habe, ja gerade nicht, aber mich jetzt wohl doch breitschlagen lassen:
https://forum.selfhtml.org/?t=111114&m=698727
Gruß Gernot
-
Hi,
Ich halte es für falsch, ja sogar für gefährlich, einfach nur lösende Antwort zu geben.
Das habe ich so wie ich das gemacht habe, ja gerade nicht,nun, in https://forum.selfhtml.org/?t=111114&m=698682 steht ein Code, der einem Anfänger, der nur eine Lösung sucht, genügen könnte.
aber mich jetzt wohl doch breitschlagen lassen:
Ich versuche gewöhnlich, folgendem Grundsatz gerecht zu werden: Poste niemals Code. Andernfalls kann man einfach zu viel Schaden anrichten.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hallo Cheatah,
Ich versuche gewöhnlich, folgendem Grundsatz gerecht zu werden: Poste niemals Code. Andernfalls kann man einfach zu viel Schaden anrichten.
Nun, dass _wir_ beide uns im Stil unterscheiden, ist ja bekannt.
Ich bin mir sicher, dass auch Nadir seinen eigenen Stil entwickeln wird.
Mir geht es darum, Anfängern zu zeigen, dass sie im Forum nicht alleine gelassen werden. Dir geht es darum, dass sie lernen, ihren eigenen Grips anzustrengen.
Ich finde unsere Arbeitsteilung ganz in Ordnung.
Gruß Gernot
-
Hi,
Nun, dass _wir_ beide uns im Stil unterscheiden, ist ja bekannt.
das ist nicht nur bekannt, sondern auch gut so :-)
Ich bin mir sicher, dass auch Nadir seinen eigenen Stil entwickeln wird.
Ja, das hoffe ich.
Ich finde unsere Arbeitsteilung ganz in Ordnung.
Dito. Daher schrieb ich ja auch, nach welchem Grundsatz _ich_ mich zu richten versuche. Dennoch, auch wenn ich selbst es gutheiße, wenn hin und wieder jemand etwas Code postet: Bei Dir passiert das IMHO deutlich zu schnell und vor allem zu vollständig. Die Fragesteller können bei Dir mit ADS arbeiten (Anti-Denk-System, auch Copy&Paste genannt). Würdest Du Codes erst im Laufe der Zeit so nennen, dass man sie _verstehen_ muss (verstehen _muss_), um sie einzusetzen, würde ich deutlich seltener meckern.
Aber das ist eindeutig nicht der Diskurs, den man beim Genuss eines Bowmore Darkest führen sollte. Ich glaube, ich genehmige mir erst mal einen Laphroaig.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes
-
-
-
-
-
-
-
Hallo Nadir,
Dort wäre es auch leichter eine If-Else-Abfrage [...] wird und ansonsten in den Normalzustand zurückversetzt, was du ja sicherlich möchtest.
Ja, das ist genau was ich vesuche hinzubekommen. Ich habe auch meine Funktion wie folgt geändert:
function displaySubNav(li, display) {
var ul = li.getElementsByTagName('ul');
if (ul && ul[0])ul[0].style.display = display;
if (ul[0].style.display = display)
{
this.style.color='red';
}else{
this.style.color='red'
}
}Aber es tut sich nichts.
Gruß
Nadir-
Hi,
function displaySubNav(li, display) {
[...]
this.style.color='red';
[...]
Aber es tut sich nichts.
'this' bezieht sich auf das aktuelle Objekt, also im obigen Fall auf die Funktion. Was sich dort tun müsste, ist ein JavaScript-Fehler. Du verfolgst noch immer einen ungünstigen Weg.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes
-
-
-
Hallo Nadir,
Ich habe es mit "ul[0].firstChild.style.color='red';" versucht, aber es funktioniert nicht und es greift auf Subpunkt 1.1 was ich eigentlich nicht will.
<script type="text/javascript">
function displaySubNav(li, display) {
var ul = li.getElementsByTagName('ul');
if (ul && ul[0])
ul[0].style.display = display;
ul[0].firstChild.style.color='red';hier ^^^^^^
sollte es wohl stattdessen li. heißen.}
Gruß Gernot
-
Hallo Nadir,
ul[0].firstChild.style.color='red';
hier ^^^^^^
sollte es wohl stattdessen li. heißen.Damit :li[0].firstChild.style.color='red';
funktioniert auch leider nicht. Die ganze Liste wird visible ;-((
Gruß
Nadir-
Hi,
Damit :li[0].firstChild.style.color='red';
funktioniert auch leider nicht. Die ganze Liste wird visible ;-((von li[0] hat Gernot nichts gesagt. In Deiner Lösung sollte die style-Collection nicht vorkommen.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes -
Hallo Nadir,
ul[0].firstChild.style.color='red';
hier ^^^^^^
sollte es wohl stattdessen li. heißen.Damit :li[0].firstChild.style.color='red';
Davon ______^^^ habe ich auch nicht gesprochen!
funktioniert auch leider nicht. Die ganze Liste wird visible ;-((
Ich glaube, du möchtest so etwas in der Art:
function displaySubNav(li, display) { var ul = li.getElementsByTagName('ul'); if (ul && ul[0]) ul[0].style.display = display; if (display=='block') { li.firstChild.style.color='red'; li.firstChild.style.fontWeight='bold'; } else { li.firstChild.style.color='black'; li.firstChild.style.fontWeight='normal'; } }Gruß Gernot
-
Hallo Nadir,
Damit :li[0].firstChild.style.color='red';
Davon ______^^^ habe ich auch nicht gesprochen!Sorry, ich habe es aders verstanden.
[...]
if (display=='block') {
li.firstChild.style.color='red';
li.firstChild.style.fontWeight='bold';
} else {
li.firstChild.style.color='black';
li.firstChild.style.fontWeight='normal';
}[...]
Diese Lösung funktioniert. ;-) ich habe die Abfrage so formuliert : if (li[0].firstChild.style.display=='block') und ich hatte Syntaxfelher dazu wie z.B. display = 'block' statt display=='block' Es wäre nie gegangen ;-(( Aber ich danke euch allen. Auch für die Geduld die ihr gehabt habt mit mir dei Sache zu folgen. Dabei habe ich auch einiges gelernt. Vielen Dank und besten Gruß Nadir-
Hi,
Diese Lösung funktioniert. ;-)
sie ist aber suboptimal.
Dabei habe ich auch einiges gelernt.
Leider nicht alles, was Du hättest lernen können. Du hast nun Layout-Informationen im Programmcode, also da, wo sie unter allen Umständen zu eliminieren sind.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes
-
-
-
-