[FRAGE] Greasemonkey & DOM - Zugriff auf href mit loop funktioniert nicht

[hvg]

Hallo liebe Forenmitglieder,

erstmal vorneweg: ich bin neu im Forum und hab nur sehr überschaubare Erfahrungen mit JS, die ich aber ständig versuche zu erweitern.

Als erstes Projekt, das über klassische Anfänger-Tutorials hinausgeht, habe ich mir vorgenommen, ein script für Greasmonkey zu schreiben, das beim Aufruf einer Google-Suche hinter jedem Treffer einer Button einfügt, der beim Draufklicken die URL des jeweiligen Links ausgibt. Die Buttons stehen soweit (siehe screenshot anbei), allerdings gibt ein Klick nicht die URL des nebenstehenden Links aus, sondern immer die URL des letzten Links auf der Seite. Ich bin ehrlichgesagt ziemlich ratlos, wie ich das Problem beheben könnte.

var verweise = document.getElementsByClassName("r");
for (i = 0; i < verweise.length; i++) {
  
  var links = verweise[i].firstChild;
  
  var kasten = document.createElement("div");
  var text =  document.createTextNode("getLink");
  var kastenText = kasten.appendChild(text);
    
  kasten.style.height = "16px";
  kasten.style.width = "55px";
  kasten.style.border = "1px solid black";
  kasten.style.background = "#FFFF99";
  kasten.style.fontSize = "13px";
  kasten.style.textAlign = "center";
  kasten.style.borderRadius = "4px";
  kasten.style.position = "absolute";
  kasten.style.left = "505px";
  kasten.style.fontFamily = "sans";  
  
  var linksUrl = links.getAttribute("href");  
    
  function alarm () {
     //alert("Hallo Welt"); //platzhalter
    
     
     alert(linksUrl); //sollte eigentlich die jeweilige url ausgeben, tuts aber nicht. immer nur die letzte der aktuellen seite
  }
    
  kasten.onclick = alarm; 
    
  verweise[i].insertBefore(kasten, links);
}

Könnt Ihr mir vielleiicht sagen, wo der Fehler liegt? Über Hinweise aller Art würde ich mich sehr freuen. Gerne auch, falls Ihr am Rest des Codes etwas auszusetzen habt. Ich hin, wie gesagt, noch in der Orientierungsphase.

Viele Grüße
Heinrich von Gagern

 

[tsseh]

http://forum.jswelt.de/javascript/59316-settimeout-paramter.html#post379669

 

[kkapsner]

Man kann solche Probleme auch noch mit .forEach() schön umgehen. Wenn man etwas hat, was Arrayähnlich ist. Hat den Vorteil, dass man da schon automatisch einen separaten Scope für jeden Durchlauf hat:

Array.prototype.forEach.call(
	document.getElementsByClassName("r"),
	function(verweis, i){
		var links = verweis.firstChild;

		var kasten = document.createElement("div");
		var text =  document.createTextNode("getLink");
		kasten.appendChild(text);

		kasten.style.height = "16px";
		kasten.style.width = "55px";
		kasten.style.border = "1px solid black";
		kasten.style.background = "#FFFF99";
		kasten.style.fontSize = "13px";
		kasten.style.textAlign = "center";
		kasten.style.borderRadius = "4px";
		kasten.style.position = "absolute";
		kasten.style.left = "505px";
		kasten.style.fontFamily = "sans";  

		var linksUrl = links.href;  

		kasten.onclick = function alarm(){
			//alert("Hallo Welt"); //platzhalter
			alert(linksUrl); //sollte eigentlich die jeweilige url ausgeben, tuts aber nicht. immer nur die letzte der aktuellen seite
		};

		verweis.insertBefore(kasten, links);
	}
);

 

[hvg]

Ok, jetzt funktionierts. Super!

Ich befürchte allerdings, mit "closure" tut sich ein weites Feld auf. Vielleicht kann ich mich am WE mal einlesen.

Vielen Dank und viele Grüße!
von Gagern

 

[kkapsner]

Bitte - gern geschehen.