Greasemonkey und Javascript in innerHTML

[DD]

Hallo, ich spiele gerade ein bisschen mit Greasemonkey herum. Ist ne Erweiterung von FF, mit der man zusätzliche Javascriptcodes in ne Seite einbauen kann. Ich hab für ein Forum folgenden Code geschrieben:

  
document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML = document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML + '<br><a href='javascript:;" onclick="insertSmiley("*unsure*")'><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0">';  

Das ganze soll nen smileybild da rein machen. Soweit funktioniert das noch. Jetzt soll aber, wenn man da drauf klickt die funktion insertSmiley, die bereits auf der seite integriert ist aufrufen. Das funkt aber nicht. Woran liegt das? Wie beheb ich das?

Es wär auch kein problem die funktion insertSmiley noch mal neu zu schreiben, nur weiß cih dann nicht wie cih das einbauen soll. Habs schon mit diesem

  
var newscript = document.createElement("script");  
newscript.setAttribute('type','text/javascript');  
newscript.text='alert("hallo")';  

probiert, das zeigt aber überhaupt keine Wrikung. Woran liegt das?

Danke schon mal ;)

[Struppi]

Das ganze soll nen smileybild da rein machen. Soweit funktioniert das noch. Jetzt soll aber, wenn man da drauf klickt die funktion insertSmiley, die bereits auf der seite integriert ist aufrufen. Das funkt aber nicht. Woran liegt das? Wie beheb ich das?

Vermutlich an der fehlenden Funktantenne. Oder meinst du eine fehlerhafte Funktion deines Javascript? Dann wäre interessant ob und was in der Fehlerkonsole steht.

Struppi.

[DD]

Vermutlich an der fehlenden Funktantenne. Oder meinst du eine fehlerhafte Funktion deines Javascript? Dann wäre interessant ob und was in der Fehlerkonsole steht.

Funkantenne? Wie darf cih das jetzt verstehen? Naja, es passiert einfach... gar ncihts! Auch keine fehlermeldung...

[Struppi]

Vermutlich an der fehlenden Funktantenne. Oder meinst du eine fehlerhafte Funktion deines Javascript? Dann wäre interessant ob und was in der Fehlerkonsole steht.

Funkantenne?

Zitat: Das funkt aber nicht.

Naja, es passiert einfach... gar ncihts! Auch keine fehlermeldung...

Du weißt wo du die Fehlermeldungen findest?

Struppi.

[DD]

Vermutlich an der fehlenden Funktantenne. Oder meinst du eine fehlerhafte Funktion deines Javascript? Dann wäre interessant ob und was in der Fehlerkonsole steht.

Funkantenne?

Zitat: Das funkt aber nicht.

replace(/funkt/g, "funktioniert");
kapiert? :D

Naja, es passiert einfach... gar ncihts! Auch keine fehlermeldung...

Du weißt wo du die Fehlermeldungen findest?

missing ; before statement
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 15

sager mir...

Struppi.

[Struppi]

Zitat: Das funkt aber nicht.
replace(/funkt/g, "funktioniert");
kapiert? :D

solange es nicht funzt.

Naja, es passiert einfach... gar ncihts! Auch keine fehlermeldung...

Du weißt wo du die Fehlermeldungen findest?

missing ; before statement
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 15

siehst.

sager mir...

Du hast einen Fehler in der Zeile 15.

Struppi.

[DD]

Zitat: Das funkt aber nicht.
replace(/funkt/g, "funktioniert");
kapiert? :D

solange es nicht funzt.

Naja, es passiert einfach... gar ncihts! Auch keine fehlermeldung...

Du weißt wo du die Fehlermeldungen findest?

missing ; before statement
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 15

siehst.

sager mir...

Du hast einen Fehler in der Zeile 15.

joar, soweit war ich auch schon mal, das hilft mir aber net so dolle weiter, da das ganze nur aus einer einzigen zeile besteht... Kannst du mir erklären, was die Fehlermeldung bedeutet?

Struppi.

[Cheatah]

Hi,

Du hast einen Fehler in der Zeile 15.
joar, soweit war ich auch schon mal, das hilft mir aber net so dolle weiter, da das ganze nur aus einer einzigen zeile besteht...

dann mach mehrere draus.

Kannst du mir erklären, was die Fehlermeldung bedeutet?

Dass ein Semikolon fehlt, welches zur Abtrennung zweier JavaScript-Statements nötig ist.

Cheatah

[Alexander (HH)]

Moin Moin!

missing ; before statement
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 15

siehst.

sager mir...

Du hast einen Fehler in der Zeile 15.
joar, soweit war ich auch schon mal, das hilft mir aber net so dolle weiter, da das ganze nur aus einer einzigen zeile besteht... Kannst du mir erklären, was die Fehlermeldung bedeutet?

Es fehlt ein Semikolon (oder der Parser ist verwirrt genug, an falscher Stelle als Folgefehler ein Semikolon zu erwarten).

Poste den Quelltext, so wie er im Browser ankommt, oder eine URL, sonst kann Dir niemand helfen.

Alexander

[Alexander (HH)]

Moin Moin!

missing ; before statement
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 15

Und? Was hast Du versucht, um dieses Parser-Problem zu beseitigen?

Alexander

[DD]

Moin Moin!

missing ; before statement
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 15

Und? Was hast Du versucht, um dieses Parser-Problem zu beseitigen?

Das Problem ist, das ich das Problem nciht verstehe... *~*

Alexander

[Cheatah]

Hi,

document.[...].innerHTML = document.[...].innerHTML + '<br><a href='javascript:;" onclick="insertSmiley("unsure")'><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0">';

  
mal abgesehen davon, dass der "+="-Operator Performance-schonend wirken sollte: Wenn dies in irgend einem[1] Sinne funktioniert, konsumiere ich einen Marzipanbesen. Repariere mal bitte die Anführungszeichen.  
  
Übrigens existiert kein Grund, einen Link zu verwenden, ohne eine Ressource zu verlinken. Ein '<a href="javascript:;">' kommt im realen Leben nicht vor - außer um die Unzulänglichkeiten des IE zu kompensieren, was bei einer Firefox-Erweiterung aber ein recht eigenwilliges Unterfangen ist.  
  
Cheatah  
  
[1] Abgesehen vom technischen Sinn, dass der Code Fehlermeldungen und Script-Abbrüche provoziert.

-- 
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

[DD]

Hi,

document.[...].innerHTML = document.[...].innerHTML + '<br><a href='javascript:;" onclick="insertSmiley("unsure")'><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0">';

>   
> mal abgesehen davon, dass der "+="-Operator Performance-schonend wirken sollte: Wenn dies in irgend einem[1] Sinne funktioniert, konsumiere ich einen Marzipanbesen. Repariere mal bitte die Anführungszeichen.  

Die anführungszeichen waren so nciht beabsichtigt. Hatte das noch mal neu getippt. Wie ist das denn eigentlich, wenn da in den anführungszeichen anführungszeichen drin sind, wo noch mal anführungszeichen drin sind? Und wann muss ich die einfachen und wann die doppelnden nehmen?  

>   
> Übrigens existiert kein Grund, einen Link zu verwenden, ohne eine Ressource zu verlinken. Ein '<a href="javascript:;">' kommt im realen Leben nicht vor - außer um die Unzulänglichkeiten des IE zu kompensieren, was bei einer Firefox-Erweiterung aber ein recht eigenwilliges Unterfangen ist.  
  
Also, einfach leer lassen, ja?  

>   
> Cheatah  
>   
> [1] Abgesehen vom technischen Sinn, dass der Code Fehlermeldungen und Script-Abbrüche provoziert.

[Cheatah]

Hi,

Die anführungszeichen waren so nciht beabsichtigt. Hatte das noch mal neu getippt.

das ist niemals eine gute Idee! Wenn Du Probleme mit irgendwelchem Code hast, dann poste ihn per Copy&Paste. Niemals anders.

Wie ist das denn eigentlich, wenn da in den anführungszeichen anführungszeichen drin sind, wo noch mal anführungszeichen drin sind?

Grundsatz der Software-Entwicklung: Wann immer Du einen Wert - egal welchen - in einen Kontext - egal welchen - bringst, musst Du diesen Wert kontextspezifisch kodieren. In JavaScript geschieht dies über den Backslash, in HTML über Entities.

Und wann muss ich die einfachen und wann die doppelnden nehmen?

Das ist sowohl in HTML als auch in JavaScript egal. Als Styleguide sei Dir jedoch ans Herz gelegt, in HTML Attributwerte in Doublequotes zu kleiden.

Übrigens existiert kein Grund, einen Link zu verwenden, ohne eine Ressource zu verlinken. Ein '<a href="javascript:;">' kommt im realen Leben nicht vor - außer um die Unzulänglichkeiten des IE zu kompensieren, was bei einer Firefox-Erweiterung aber ein recht eigenwilliges Unterfangen ist.

Also, einfach leer lassen, ja?

Nein, kein <a>-Element verwenden. Es dient der Verlinkung einer weiteren Ressource, macht hier also exakt so viel Sinn wie, sagen wir, ein <table>-Element.

Cheatah

[1] Abgesehen vom technischen Sinn, dass der Code Fehlermeldungen und Script-Abbrüche provoziert.

Zitiere übrigens bitte nur das, worauf Du Dich beziehst, danke.

Cheatah

[DD]

Also, ich hab mal alle eure Ratschläge befolgt, und jetzt sieht das ganze so aus:

document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML += '<img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0">';

(direkt kopiert ^^)

Jetzt hab ich aber immer noch das Hauptproblem: Wie bekomm ich da jetzt ne Javascript funktion eingebunden? Wenn ich da einfach onclick schreibe und auf eine funktion verweise, die bereits auf der seite existiert läd der ewig, vermutlich weil er die Funktion nciht findet. Wenn ich sie direkt in die datei schreib: Geht auch net. Und wenn ich das ganze als link mach und dann bei href="" die funktion mittels javascript: reinmach wills auch net.

Wie bekomm ich jetzt also da die funktion rein?

[DD]

Also, ihc bin jetzt wieder auf das <a> zurückgekommen. Einfach auf dem Grunde, weil a einmal die hand so toll als mauszeiger macht, zum anderem wegen diesem Rahmen, der kommt wenn man druff klickt. Kann man sicherlich auch anders machen, aber das sollte jetzt nciht das problem sein.

Hab das also so:

document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML += '<a href="javascript:insertSmiley(unsure);"><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0"></a>';

Da kommt einmal der error:

document.getElementsByTagName("form")[1] has no properties
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 10

Öhm, was soll das heißen?

Und wenn ich drauf klicke kommt:

unsure is not defined
javascript:insertSmiley(unsure);
Line 1

...das versteh ich irgendwie auch nciht so ganz...

[DD]

Hmm, also, das Problemchen hab cih jetzt soweit behoben:

document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML += '<a href="javascript:insertSmiley("unsure");"><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0"></a>';

Was ich noch nicht ganz kapiert hab:

<a href="javascript:insertSmiley("unsure");">

das will der verständlicherweise wegen den anführungszeichen nciht schlucken. Das unsure muss aber in anführungszeichen stehen. und das ganze ja auch irgendwie oder? Was muss ich denn da jetzt verändern?

[Gunnar Bittersmann]

@@DD:

<img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0"></a>';

<a href="javascript:insertSmiley("unsure");">

das will der verständlicherweise wegen den anführungszeichen nciht schlucken. Das unsure muss aber in anführungszeichen stehen.

Es gibt auch einfache. Und es gibt kontextspezifische Maskierung.

Was muss ich denn da jetzt verändern?

Das unsinnige 'a'-Element rausschmeißen.

Einen sinnigen Alternativtext fürs Bild einfügen.

Live long and prosper,
Gunnar

[DD]

Es gibt auch einfache. Und es gibt kontextspezifische Maskierung.

Wenn ich aber jetzt
<a href="javascript:insertSmiley("unsure");">
verwende tritt der gleiche effekt auf: der ließt das href irgendwie nur von dem erstem anführungszeichen bis zum nächtem. Und mit den einfach will das auch nicht...

Was muss ich denn da jetzt verändern?

Das unsinnige 'a'-Element rausschmeißen.

Das tut ja immer noch nix zur Sache...

Einen sinnigen Alternativtext fürs Bild einfügen.

Ne, gibt keine alternative ^^

Live long and prosper,
Gunnar

[Cheatah]

Hi,

das will der verständlicherweise wegen den anführungszeichen nciht schlucken. Das unsure muss aber in anführungszeichen stehen. und das ganze ja auch irgendwie oder?

ich zitiere mich selbst:

| Grundsatz der Software-Entwicklung: Wann immer Du einen Wert - egal
| welchen - in einen Kontext - egal welchen - bringst, musst Du diesen Wert
| kontextspezifisch kodieren. In JavaScript geschieht dies über den
| Backslash, in HTML über Entities.

Cheatah

[DD]

| Grundsatz der Software-Entwicklung: Wann immer Du einen Wert - egal
| welchen - in einen Kontext - egal welchen - bringst, musst Du diesen Wert
| kontextspezifisch kodieren. In JavaScript geschieht dies über den
| Backslash, in HTML über Entities.

Cheatah

Da entseht nur ein syntax error *~*

Ich fasse es am besten noch mal zusammen:

hab mal die smiley funktion rauskopiert:
function insertSmiley(smiley) {
  document.message_form.message.value += smiley;
}

Wenn ich jetzt:

document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML += '<a href="javascript:insertSmiley();"><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0"></a>';

schreibe kommt logischwerweise der fehler document.getElementsByTagName("form")[1] has no properties (weil in der klammer nix drin steht, oder?), es wird allerdings in document.message_form.message.value das Wort undefined ausgegeben.

Naja, schreib ich:

document.getElementsByTagName("form")[1].getElementsByTagName("table")[0].getElementsByTagName("td")[1].innerHTML += '<a href="javascript:insertSmiley("unsure");"><img src="http://images.neopets.com/neoboards/smilies/unsure.gif" alt="" border="0"></a>';

kommt einmal der Fehler:
document.getElementsByTagName("form")[1] has no properties

und dann noch:
syntax error
javascript:insertSmiley(

[Gunnar Bittersmann]

@@DD:

Also, ihc bin jetzt wieder auf das <a> zurückgekommen. Einfach auf dem Grunde, weil a einmal die hand so toll als mauszeiger macht,

Grober Unfug. Zur Gestaltung sind nicht HTML-Elemente willkürlich zu missbrauchen, sondern ist CSS zu verwenden; in dem Falle die 'cursor'-Eigenschaft.

Da kommt einmal der error:

document.getElementsByTagName("form")[1] has no properties
file:///(...)/mehrsmileysfrsneoboard.user.js
Line 10

Öhm, was soll das heißen?

Vermutlich, dass es in dem Array der 'form'-Elemente keins mit dem Index 1 gibt.

unsure is not defined
javascript:insertSmiley(unsure);
Line 1

Wo wird denn die Variable 'unsure' gesetzt?

...das versteh ich irgendwie auch nciht so ganz...

Die Tips für Fragende hast du offensichtlich auch nicht verstanden.

Live long and prosper,
Gunnar

[DD]

@@DD:

Grober Unfug. Zur Gestaltung sind nicht HTML-Elemente willkürlich zu missbrauchen, sondern ist CSS zu verwenden; in dem Falle die 'cursor'-Eigenschaft.

sry, dass ich das a missbraucht hab, ich hab einfach keine Lustda noch nen stylesheet zu schreiben, sit ja nur zum probezweck und tut nix zur sache.

Tips für Fragende hast du offensichtlich auch nicht verstanden.

ich dache eigentlich schon...

Live long and prosper,
Gunnar