li-Element- in Funktion erzeugen?
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
bild
code
dreh
element
folgenden code
folgendes problem
frage
fragestellung
funktion
hilfe
http
kreisen
problem
sonntag
span
text
traum
url
vorhandene funktion
vorschlag
-
Hi,
ich dreh mich mal wieder im Kreis und bräuchte etwas Hilfe.
Es geht wieder um ein GM-Script.
Folgendes Problem:
Ich habe eine Funktion, die einen Text link erzeugt , das geht so weit auch alles wie gewünscht.
// Textlink erzeugen und Linkadresse festlegen function insertLink() { var menu = document.getElementById('nav-2'); var newLink = document.createElement('a'); newLink.href = "javascript:KW_Anzeigen();"; newLink.appendChild(document.createTextNode('KW in der MotD')); menu.insertBefore(newLink, menu.firstChild); }
Im Quelltext erscheint der Link dann so:
<a href="javascript:KW_Anzeigen();">KW in der MotD</a>
Nun möchte ich das der Link zusätzlich in einem li-Element- ausgeführt wird.
Also so:
<li> <a href="javascript:KW_Anzeigen();">KW in der MotD</a> </li>
Kann ich das irgendwie durch die vorhandene Funktion
ermöglichen?insertLink()
Und weil Sonntag ist noch eine andere Frage dazu,
wie kann ich das Unterstreichen des Links verhindern?
Im Normalfall würde ich das ja mit
erledigen.style="text-decoration: none;"
Allerdings komm ich nicht drauf wie man das nun in der Funktion angibt.
Versucht habe ich es so,insertLink.style.text-decoration = 'none';
was aber nur einen Syntaxfehler verursacht.
LG und nen schönen Sonntag
Beitrag zuletzt geändert: 21.10.2012 16:02:11 von aff3m1tw4ff3 -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Vorschlag: du schaust dir den folgenden Code an
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head> <title>LI-ELEMENTS!</title> <script type="text/javascript">//<![CDATA[ function insertLink() { var menu = document.getElementById('nav-2'); var newLink = document.createElement('a'); newLink.onclick = KW_Anzeigen; newLink.href = '#'; newLink.style.textDecoration = 'none'; newLink.appendChild(document.createTextNode('KW in der MotD')); item = document.createElement('li'); item.appendChild(newLink); menu.insertBefore(item, menu.firstChild); } function KW_Anzeigen() { alert('KW_Anzeigen()'); return false; // damit dem Link nicht wirklich gefolgt wird } // ]]></script> </head> <body> <ul id='nav-2'> <li>Links!</li> </ul> <p><a href="#" onclick="insertLink(); return false;">Add Link</a></p> </body> </html> -
Vorschlag angenommen und Problem aus der Fragestellung gelöst
Allerdings bleibt noch ein Problem vorhanden, dachte das löst sich durch das li-Element-, hat es aber nicht.
Der Textlink wird nicht in der gleichen Höhe wie die folgenden ausgeführt. ( Bild )
Die anderen Links haben zusätzlich noch 2 span-Elemente, könnte das Zufällig daran liegen?
Dann müsste man ja rein theoretisch nur 2 weitere
in die Funktion einfügen.item
item = document.createElement('span'); item.appendChild(newLink);
Hab ich natürlich schon Probiert, musste aber festellen das man nicht einfach ein weiteres einfügen kann.
Die anderen Links sehen mit den span-Elementen- so aus:
<li> <a href="/overview/"><span class="btn-right"><span class="btn-left">Übersicht</span></span></a> </li>
-
Mach es doch so:
var newLink = document.createElement('a'); newLink.onclick = KW_Anzeigen; newLink.href = '#'; newLink.style.textDecoration = 'none'; var span1 = document.createElement('span'); span1.className = 'btn-left'; span1.appendChild(document.createTextNode('KW in der MotD')); var span2 = document.createElement('span'); span2.className = 'btn-right'; span2.appendChild(span1); newLink.appendChild(span2); var item = document.createElement('li'); item.appendChild(newLink); // und jetzt item einfach an die Liste anhängenDer Code ist allerdings nicht getestet… -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
