Wie kann ich ein div auf meiner HTML-Seite mit Javascript zielen, um den Inhalt eines Elements zu ändern?

Question

Ich habe eine interessante Frage. Ich lasse Squarespace @buscadprimero.caminoglobal.org laufen und muss den oberen rechten Knopf auf der Navigation anvisieren (Ingresar, was bedeutet, dass ich mich anmelde), um ein Javascript-Formular aufzurufen, das mir über den Embed-Code zur Verfügung gestellt wurde. Der Code selbst funktioniert gut, wenn er als Codeblock in den Hauptteil einer Seite eingefügt wird, aber Squarespace erlaubt nur Navigationsschaltflächen im oberen Bereich als Hyperlinks. Es gibt keinen Platz für mich, Code zu dem Button selbst hinzuzufügen, da es eine weitgehend Consumer-Plattform ist und sich hervorragend für eine einfache Anwendung eignet, bis Sie versuchen, die Funktionsweise zu ändern.

Sie machen benutzerdefinierte Code über ein "Code-Injektion" -Menü, die den HTML-Header der Seite, was auch immer Sie wollen, Code hinzufügen, so habe ich versucht, dieses div, das keine ID aber Wer ist Klasse external, mit Javascript, um seinen Inhalt mit einem onclick Listener zu ersetzen, um dieses Formular zu erstellen. Verfolgung?

Hier ist mein Code einbetten, die wie ich sagte, ist in Ordnung:

<script>// <![CDATA[ 
    !function(e,t){e._cc={}, e._cc.host="https://www.coachingcloud.com/";var n=function(){var n=t.createElement("script"),c=t.getElementsByTagName("script")[0];n.src=e._cc.host+"login.min.js",c.parentNode.insertBefore(n,c)};e.addEventListener?e.addEventListener("load",n,!1):e.attachEvent("onload",n)}(window,document); 
// ]]></script> 

Ich habe document.getElementsByClassName("external").innerHTML; versucht, aber wenn sie auf eine var gesetzt, die undefined zurückgibt. Neu in Javascript, aber keine Angst zu lernen. Ich würde gerne herausfinden, wie man das div richtig anvisiert, und dann seinen Inhalt (der momentan ein Link zu meiner 404-Seite ist) durch eine Javascript-Funktion ersetzt, die beim Klicken aktiviert wird. Danke für die Anleitung!

Answer 1

Dank der großen Hilfe von @ Arg0n, ich habe jetzt eine Arbeits Login-Formular das erscheint in der oberen rechten Taste auf meiner Website. Verwendung:

$(function() { $("#mainNavigation .collection").last().html("<span id='cc-login'>Ingresar</span>"); });

als die Funktion, den Inhalt des div in Frage zu ersetzen, eingefügt I <span id='cc-login'>Ingresar</span> als Anruf an den vorgesehenen Code einbetten:

<![CDATA[ !function(e,t){e._cc={}, e._cc.host="https://www.coachingcloud.com/";var n=function(){var n=t.createElement("script"),c=t.getElementsByTagName("script")[0];n.src=e._cc.ho‌​st+"login.min.js",c.parentNode.insertBefore(n,c)};e.addEventListener?e.addEventLi‌​stener("load",n,!1):e.attachEvent("onload",n)}(window,document); // ]]>

Es stellte sich heraus, dass ein wenig jQuery war hilfreich beim Zugriff auf die gewünschte div, und die Einstellung der html Inhalte war ein wenig jenseits meiner Fachgebiete.

Vielen Dank an die StackOverflow-Community, die mir geholfen hat, mehr über Seitenelemente mit Javascript zu erfahren, um den Inhalt prozedural zu manipulieren.

Answer 2

Ich habe Folgendes auf Ihrer Website in Chrome getestet und den Inhalt erfolgreich geändert. Die Seite mehrere „.Disney“ Elemente enthalten, so dass ich nur wählen, die letzte:

JavaScript/jQuery

$("#mainNavigation .collection").last().html("<a href='/newlink'>Test</a>");