Frage von Ucanaskme, 31

Mit JS a-Tag verändern(innerHTML, outerHTML), marquee-Tag schreiben?

Hallo,

Mein Thema ist etwas umständlich zu erklären.

Ich versuche, mittels JS einen a-Tag zu verändern. Gemeint ist das folgendermaßen: 

<div id="whatever"></div>

 

Soll, bei einer bestimmten Bedingung, zu 

<div id="whatever"><marquee DIRECTION=left style="...">blablabla </marquee></div>

werden. D.h. das ganze muss mit JS gemacht werden, da die Bedingung auch mit JS abgefragt wird.

Wie kann ich das realisieren? Ich habe es bereits mit innerHTMl usw. versucht, jedoch bisher keinen Erfolg gehabt.

Sry, wenn die Frage etwas falsch/kompliziert formuliert ist, bei Fragen bitte einfach fragen ;-)

Vielen Dank für Hilfe!

Antwort
von regex9, 9

Gebe deinem Container-Element eine Id (bspw. container). Innerhalb deines Skriptes kannst du diese Funktion nutzen, um ein marquee-Element dynamisch anzuhängen:

function addMarquee() {
  var container = document.getElementById("container");
  var marquee = document.createElement("marquee");
  marquee.setAttribute("direction", "left");
  var text = document.createTextNode("test");
  marquee.appendChild(text);
container.appendChild(marquee);
}
Kommentar von Ucanaskme ,

Habe es gleich mal ausprobiert. Es klappt jedoch nicht, führe ich die Funktion aus, passiert nichts und die timer() Funktion geht auch nicht mehr- statt eine Zahl steht dort dann undefinded. 

Kommentar von regex9 ,

Dann ist dein Skript falsch, denn mein Code oben funktioniert auf jeden Fall und wurde auch getestet.

Antwort
von Berny96, 20

Du kannst den Teil den du ändern willst in einen DIV Container packen, ihm eine ID geben und dann folgendermaßen den Inhalt ändern. Nehmen wir an dein HTML sieht im body jetzt so aus:

<div id="container">
 <a href="deinlink">Link</a>
</div>

Dann kannst du ganz einfach den inneren HTML des DIV's (also dein <a> tag) so ändern:

let container = document.getElementById("container");
container.innerHTML = '<a href="neuerLink">NeuerLink</a>';

Dabei muss es natürlich kein neuer Link sein sondern könnte eben alles sein was du willst.

Kommentar von Ucanaskme ,

Cool, danke für die schnelle Antwort! Ich probiere es gleich mal aus, melde mich noch mal

Kommentar von Ucanaskme ,

Es klappt leider noch nicht so, wie ich mir das vorstelle.

Ich habe einen Container, der anfangs leer ist, und, wenn die Bedingung erfüllt ist, mit <marquee>blabla</marquee> gefüllt werden soll.


Kommentar von Berny96 ,

Welche Bedingung denn?

Vielleicht wird diese nie erfüllt?

Kommentar von Ucanaskme ,

Doch doch :-) , dass wird sie 100%tig. Sie überprüft bei Safari, ob man sich im privaten Modus befindet.

Aber auch ohne die if-Bedingung geht es nicht.

Ich habe meine Frage jetzt etwas übersichtlicher gestaltet, vielleicht hilft das.


Kommentar von Berny96 ,

So wie ich das sehe solltest du jetzt ganz einfach das hier machen können:

document.getElementById("whatever").innerHTML = "
<marquee DIRECTION=left style="...">blablabla </marquee>";

Also halt eben in einer Zeile..

Kommentar von Ucanaskme ,

Das habe ich ausprobiert, aber es funktioniert nicht, weshalb ich hier nachgefragt habe...

Dachte ich zuerst aber auch, dass es so klappen würde.

Kommentar von Berny96 ,

Vielleicht schickst du mir mal den Code, das müsste nämlich definitv so klappen. Es sei denn natürlich den Code den du versuchst zu setzen ist fehlerhaft. Dann wirds natürlich einfach ignoriert. Übrigens, habe gerade gesehen das marquee outdated ist und eventuell sogar schon gelöscht wurde und gar nicht mehr von Browsern interpretiert werden kann. 

https://developer.mozilla.org/de/docs/Web/HTML/Element/marquee

Kommentar von Ucanaskme ,

Doch, ein normales marquee geht bei mir noch.

Ich schicke dir mal den Code, vielen Dank für die Mühe im Voraus (und die bis hierhin!)!

Kommentar von regex9 ,

So wohl eher:

var container = document.getElementById("container");
container.innerHTML = "<marquee direction='left' style='...'>test!</marquee>";

Durch die doppelten Anführungszeichen unterbrichst du sonst den String. An sich kann das direction-Attribut auch weggelassen werden, denn der Standardwert ist eh left.

Kommentar von Ucanaskme ,

dankeschön, habe ich gelesen, probiere ich heute mal aus, melde mich, bis dann :-)

Antwort
von Minilexikon, 4

Offenbar willst du den Benutzer auf etwas hinweisen, wenn er sich im Safari im privaten Modus befindet? Die Bedingung kannst du selbst codetechnisch formulieren?

Marquee ist deprecated, auch wenn es bei dir noch funktioniert. Darüber hinaus wird Lauftext heutzutage nicht mehr gerne gesehen. Ich würde dir empfehlen, auf eine andere Lösung auszuweichen.

Kommentar von Ucanaskme ,

Nein, nicht ich, meine Kollegen :-) 

Es geht nicht um eine offizielle Homepage, sondern eine Art Intranet. Marquee wird bei uns deshalb solange unterstützt, wie wir es gebrauchen, vereinfacht ausgedrückt. Aber sonst könnten wir uns auch so eine Art "Lauftext" selber basteln, o.ä., was genauso aussieht, daran sollte es letzlich nicht scheitern.

Hättest Du denn sonst eine Idee zu meiner eigentlichen Frage? 

Kommentar von Minilexikon ,

Okay^^

Eigentlich müsste das so funktionieren: http://codepen.io/Minilexikon/pen/pNWjbz?editors=1010#0

In jQuery geht die Lösung noch etwas kürzer: http://codepen.io/pen/?editors=1010

Kann mir jetzt aber nicht erklären, warum die Lösung von regex9 nicht funktioniert. Die sieht soweit richtig aus...

Kommentar von Ucanaskme ,

Komisch. Das geht bei mir nicht. Jetzt habe ich es mit p statt marquee ausprobiert, also das setAttribute weggelassen und bei createElement p eingetragen.

Nicht mal blablabla wird angezeigt.

Es muss doch für innerHTML auch nichts freigeschaltet werden, oder?!?

Sogar in einem anderen Browser geht das nicht. Scheint an dem Server zu liegen?!?

Kommentar von Ucanaskme ,

So, ich bin raus ! 

Mein Fehler: es ist immer besser, erst ein Element zu kreieren, bevor man es anspricht...

Bin wohl etwas neben der Spur :-D 

Also, es klappt jetzt, ich habe einfach mal den ScriptCode hinter das div Element gesetzt, siehe da, die Erlösung...

Joa, sry, falls das jetzt ein wenig doof daherkommt ;-)

Kommentar von Minilexikon ,

Solche Fehler haben wir alle mal gemacht ;)

Cool, dass es jetzt funktioniert (y)

Keine passende Antwort gefunden?

Fragen Sie die Community