Newsgroup: it.comp.lang.javascript
Titolo: Javascript e DOM, un aiutino?

ciao ragazzi, prendendo spunto dal codice di lightbox:
if (!document.getElementsByTagName){ return; }
var anchors = document.getElementsByTagName('a');
var areas = document.getElementsByTagName('area');
// loop through all anchor tags
for (var i=0; i<anchors.length; i++){
 var anchor = anchors[i];
 var relAttribute = String(anchor.getAttribute('rel'));
 // use the string.match() method to catch 'lightbox' references in
the rel attribute
 if (anchor.getAttribute('href') && (relAttribute.toLowerCase().match
('lightbox'))){
  anchor.onclick = function () {myLightbox.start(this); return false;}
 }
}
io volevo fare una cosa simile, assegnare delle funzioni javascript ai
vari tag in base ai loro attributi.
quindi, per esempio, vorrei che un mio tag
<a rel="jsF.provaA" name="a">funzione provaA</a>
mi esegua la funzione provaA(), invece
<a rel="jsF.provaB" name="b">funzione provaB</a>
esegua la funzione provaB().
ho modificato lo script sopra, fino ad ottenere questo (posto tutto il
codice che uso per il mio test, non è molto lungo):
--------------------------------------------------------------------------------------------------------
<script>
function tagIdentify() {
	if (!document.getElementsByTagName){ return; }
	var anchors = document.getElementsByTagName('a');
	for (var i=0; i < anchors.length; i++){
		var anchor = anchors[i];
		var relAttribute = String(anchor.getAttribute('rel'));
		if(relAttribute.match('jsF')){
			if(relAttribute.indexOf(".")){
				rayRel = relAttribute.split(".");
				var fn = rayRel[1];
				anchor.onclick = function(){ fn(); return false; }
			}
		}
	}
}
function provaA(){
	alert('funzione A!');
}
function provaB(){
	alert('funzione B!');
}
function getIt(x){
	var m = document.getElementById(x).onclick;
	alert(m);
}
</script>
<div id="pppp" onclick="tagIdentify();">init</div>
<br /><br />
<a rel="jsF.provaA" id="A" class="prova" name="null">funzione provaA</
a><br />
<a rel="jsF.provaB" id="B" class="prova" name="null">funzione provaB</
a>
<br /><br />
<a onclick="getIt('A');" name="eee">get it</a>
--------------------------------------------------------------------------------------------------------
..che naturalmente non funziona.
cliccando sul get it, si vede che a ogni tag viene associata la
funzione:
function () {
    fn();
    return false;
}
che dà errore..
ho provato con
anchor.onclick =  fn();
ma l'errore che mi riporta è 'fn is not a function'... come posso
fare?
spero di essere stato chiaro..

 anchor.onclick =  fn();
non ci vanno le parentesi ... non ho mai provato con una variabile, ma se
hai il nome della function nella var fn dovresti usare
 onclick=fn;
prova un po'
-- 
"e mai che mi sia venuto in mente
 di essere più ubriaco di voi
 di essere molto più ubriaco di voi"
									  F.D.A.

si, ho usato il metodo dell'indexOf perchè IE mi restituisce sempre
false se anchor.getAttribute('rel') utilizza un attributo diverso dal
rel (tipo class o name)..
allora ho scelto di usare solo il rel, mettendo $mioPrefisso.
$nomeFunzione...
se metto onclick=fn;  non funziona, sono abbastanza sicuro perchè
utilizzo già delle funzioni simili:
function esegui(x, funzione, parametro){
//[...cut...faccio tutti i miei cazzi e mazzi]
 if(funzione){
  if(parametro){
   funzione(parametro);
 }else{
  funzione();
 }
}
e ha sempre funzionato

 se metto onclick=fn;  non funziona, sono abbastanza sicuro 
io sono sicuro del contrario ... 
In questi casi occorre semplificare il tutto. Esempio funzionante:
<html><head>
<script type="text/javascript">
 function test() {
  alert("ok");
 }
 var miafun=test;
 window.onload=function() {
	document.getElementsByTagName("div")[0].onclick=miafun;
 }
 </script>
 </head><body>
 <div>miodiv, clicca!</div>
 </body></html>
-- 
"qualcuno è andato per età
 qualcuno perchè già dottore
 e insegue una maturità, si è sposato, fa carriera
 ed è una morte un po' peggiore"
									    F.G.

Hai ragione, il tuo metodo funziona..
però ora non mi spiego perchè non funiziona il mio:
---------------------------------------------------------------------------
<script type="text/javascript">
function tagIdentify() {
	if (!document.getElementsByTagName){ return; }
	var anchors = document.getElementsByTagName('a');
	for (var i=0; i < anchors.length; i++){
		var anchor = anchors[i];
		var relAttribute = String(anchor.getAttribute('rel'));
		if(relAttribute.match('jsF')){
			if(relAttribute.indexOf(".")){
				rayRel = relAttribute.split(".");
				//anchor.onclick = rayRel[1];
				anchor.onclick = provaA;
			}
		}
	}
}
function follow(j, funzione, parametro){
	alert(j);
	if(funzione){
		if(parametro){
			funzione(parametro);
		}else{
			funzione();
		}
	}
}
function provaA(){
	alert('funzione A!');
}
function provaB(){
	alert('funzione B!');
}
function getIt(x){
	var m = document.getElementById(x).onclick;
	alert(m);
}
</script>
<div id="pppp" onclick="tagIdentify();">init</div>
<br /><br />
<a rel="jsF.provaA" id="A" class="prova" name="null">funzione provaA</
a><br />
<a rel="jsF.provaB" id="B" class="prova" name="null">funzione provaB</
a>
<br /><br />
<a onclick="getIt('A');" name="eee">get it</a><br />
<a onclick="getIt('B');" name="eee">get it B</a><br />
<a onclick="follow(6, provaA, false);" name="eee">follow</a><br />
---------------------------------------------------------------------------
se lasci anchor.onclick = provaA; funziona, tutti i <a> eseguono la
funzione provaA...
ma se metti anchor.onclick = rayRel[1]; (nel codice è commentato) non
succede niente..
credo sia un problema di sintassi o di tipo di variabile, infatti col
metodo 1 si associa la funzione al onclick, col metodo 2 gli si
associa solo il valore 'provaA' o 'provaB'.
ed in effetti nella riga
var relAttribute = String(anchor.getAttribute('rel'));
dichiaro che è una stringa...ma anche mettendo var relAttribute =
(anchor.getAttribute('rel'); il risultato è uguale.
non ci salto fuori

 				anchor.onclick = provaA;
non so ... così al volo l'unico modo che mi viene in mente è usare eval,
del tipo
 eval("anchor.onclick = "+rayRel[1]);
-- 
"Capivamo di essere tanti
 capivamo di essere forti,
 il problema era solamente
 come farlo capire ai morti."
									    C.L.

risolto
 eval('anchor.onclick = '+rayRel[1]+';');
:D


Per carita` d'iddio.. L'uso di eval e` l'ultima spiaggia, se non vi
sono altri modi (eval is evil. C'assomiglia anche un po'). Nel caso
in questione, se le funzioni sono globali, ti basta un:
	anchor.onclick = window[rayRel[1]];
Che, come diceva un certo quattrocchi, e` meglio. :)
-- 
"When you have eliminated the impossible, whatever remains, however
improbable, must be the truth."


perchè eval() non và bene?
non fà altro che valutare se l'argomento è codice js e in caso
corretto lo esegue..
anche in termini di sicurezza è cmq lato client..
potresti spiegare meglio la tua risposta?

 potresti spiegare meglio la tua risposta?
Spero di averti dato link e informazioni utili per capire un po' meglio
l'argomento. Idealmente comunque, il 99% delle cose per cui normalmente
si usa eval puo` essere rimpiazzato con qualcosa di piu` idoneo.
E nel momento in cui l'uso di "JSON" sara` nativo (vedasi ad esempio FF
3.1), sara` possibile farne del tutto a meno, per lo piu`.


capito, grazie mille per l'aiuto... non conosco bene il js, ma conosco
l'XSS, e (credo) che la sua pericolosità sia dovuta molto alla
funzione della pagina.. se non è una pagina interattiva (nel senso
quello che fà un utente, lo visualizza solo lui..ma questo è un altro
discorso)
un'ultima cosa: se io volessi associare anche dei valori a quelle
funzioni?
nell'attributo rel, ad esempio, vorrei mettere la stringa:
<a rel="jsF.provaA.5.4" id="A" class="prova" name="null">funzione
provaA</a>
dove provaA  = nome della funzione
5 = primo valore
4 = secondo valore.. la funzione provaA sarà:
function provaA(a, b){
  var c = a+b;
  alert(c);
}
come faccio?
nella mia ignoranza in js ho provato con
anchor.onclick = window[rayRel[1](rayRel[2], rayRel[3])];
(naturalmente controllo che tutti i valori siano settati)
ma non funziona.. sempre undefined..

con un paio di test riesco a fare quello che devo ma usando l'eval
eval('anchor.onclick = function(){ ' + rayRel[1] + '; }');
invece utilizzando il rifeimento window non riesco (forse è un
problema di sintassi), ho provato con
anchor.onclick = function(){ window[rayRel[1]] }
ma non mi prende il riferimento, ma mi associa:
function () {
    window[rayRel[1]];
}

 anchor.onclick = window[rayRel[1](rayRel[2], rayRel[3])];
Ci eri andato quasi vicino:
window[rayRel[1]](rayRel[2], rayRel[3]);
Quello che forse ti sfugge e` il significato di tale sintassi.. E
quindi, provero` a spiegartelo un poco meglio.
# "DOT NOTATION" e "SQUARE BRACKET NOTATION"
Puoi riferirti a una proprieta` di un oggetto tramite il punto, o
le quadre. Esempio:
	var myObject = new Object();
 
	myObject.valore = "123 Stella";
e` del tutto equivalente a:
	var myObject = new Object();
 
	myObject["valore"] = "123 Stella";
Nota: non stai usando un "array", stai usando un modo diverso per
ottenere il medesimo riferimento.
Vantaggi: la seconda sintassi e` "parametrica", visto che imposti
il nome della proprieta` tramite una stringa. Questo ti permette,
quindi, di fare:
	var quale = "valore";
 
	alert(myObject[quale]);
 
	quale = "altro valore";
	alert(myObject[quale]);
Come puoi vedere, puoi anche usare proprieta` che normalmente non
avresti modo di associare con la dot notation.
# METODI
I metodi in un oggetto, sono in realta` delle proprieta` a cui si
associa un "riferimento a funzione":
	function say(what){
		alert(what);
	}
	say("Hello");
	myObject.dicaDuca = say;
	myObject.dicaDuca("Salve");
# VARIABILI E FUNZIONI GLOBALI
Le variabili e le funzioni globali, nei browser, sono considerate
proprieta` e metodi dell'oggetto window. Indiragionpercui:
 
	var what = "Hello";
	function say(){
		alert(this.what);
	}
	/* le successive due righe sono equivalenti */
	window.say();
	say();
	var myObject = new Object();
	myObject.what = "Salve";
	myObject.dicaDuca = say;
	myObject.dicaDuca();
	/* myObject e` a sua volta proprieta` di window */
	window.myObject.dicaDuca();
# CONCLUSIONI
Ergo, per tornare al nostro esempio:
	function sum(a,b){
		return a + b;
	}
	alert( window["sum"](1,3) );
In quanto:
- le funzioni globali sono considerate metodi di window
- i metodi sono proprieta` con riferimento a funzione
- posso accedere a una proprieta` di un oggetto tramite la square
bracket notation
E per inciso:
	sum == window.sum == window["sum"]
Spero che adesso ti sia un po' tutto piu` chiaro. :)


grazie mille, non capita spesso di ricevere spiegazioni così
dettagliate..
tuttavia c'è ancora qualcosa che mi sfugge, in quanto col metodo
indicato è come se associassi il valore della funzione al tag, e non
la funzione in sè...
forse mi sono spiegato male io dall'inizio, quello che vorrei è che se
nel markup della pagina ho:
<a rel="jsF.provaA.5.6" id="A" class="prova" name="null">funzione
provaA</a>
dovrei avere l'equivalente di
<a rel="jsF.provaA.5.6" id="A" class="prova" name="null"
onclick="provaA(5, 6);">funzione provaA</a>
invece, eseguendo la funzione (posto il codice completo della pagina):
<script type="text/javascript">
function tagIdentify() {
	if (!document.getElementsByTagName){ return; }
	var anchors = document.getElementsByTagName('a');
	for (var i=0; i < anchors.length; i++){
		var anchor = anchors[i];
		var relAttribute = anchor.getAttribute('rel');
		if(relAttribute != null && relAttribute.match('jsF')){
			if(relAttribute.indexOf(".")){
				rayRel = relAttribute.split(".");
				if(rayRel.length == 2){
					anchor.onclick = window[rayRel[1]];
				}else if(rayRel.length == 3){
					anchor.onclick = window[rayRel[1]](rayRel[2]);
				}else if(rayRel.length == 4){
					anchor.onclick = window[rayRel[1]](rayRel[2], rayRel[3]);
				}
			}
		}
	}
}
function provaA(a, b){
	//alert('funzione A: ' + a + b);
	document.getElementById('io').value = a+b;
}
function provaB(){
	//alert('funzione B');
	document.getElementById('io').value = 'funzione B';
}
function getIt(x){
	var m = document.getElementById(x).onclick;
	alert(m);
}
</script>
<div id="pppp" onclick="tagIdentify();">init</div>
<a rel="jsF.provaA.5.6" id="A" class="prova" name="null">funzione
provaA</a><br />
<a rel="jsF.provaB" id="B" class="prova" name="null">funzione provaB</
a><br />
<a onclick="getIt('A');" name="eee">get it A</a><br />
<a onclick="getIt('B');" name="eee">get it B</a><br />
<input type="text" name="io" id="io" />
ottengo due effetti indesiderati: il primo è che nell'eseguire
tagIdentify() mi lancia anche le funzioni 'bersaglio' (provaA e
provaB) mentre  le associa al tag (e questo è un problema),
secondo che solo la funzione provaB viene associata correttamente,
cioè a ogni click del bersaglio viene eseguita.. invece provaA viene
eseguita dentro tagIdentify ma non associata al tag (getIt('A') ==
undefined)
prendendo spunto dai tui esempi ho provato la variante
function tagIdentify() {
	if (!document.getElementsByTagName){ return; }
	var anchors = document.getElementsByTagName('a');
	for (var i=0; i < anchors.length; i++){
		var anchor = anchors[i];
		var relAttribute = anchor.getAttribute('rel');
		if(relAttribute != null && relAttribute.match('jsF')){
			if(relAttribute.indexOf(".")){
				rayRel = relAttribute.split(".");
				var myObject = new Object();
				if(rayRel.length == 2){
					//anchor.onclick = window[rayRel[1]];
					myObject.execute = window[rayRel[1]];
				}else if(rayRel.length == 3){
					//anchor.onclick = window[rayRel[1]](rayRel[2]);
					myObject.execute = window[rayRel[1]](rayRel[2]);
				}else if(rayRel.length == 4){
					//alert(rayRel[1] + '(' + rayRel[2] + ', ' + rayRel[3] + ');');
					//anchor.onclick = window[rayRel[1](rayRel[2], rayRel[3])];
					//myObject.execute = window[rayRel[1]](rayRel[2], rayRel[3]);
					myObject.execute = window.rayRel[1] + '(' + rayRel[2] + ', ' +
rayRel[3] + ');';
				}
				anchor.onclick = myObject.execute;
			}
		}
	}
}
e mi crea l'associazione:
A = provaA(5, 6);
B = function provaB(){
	document.getElementById('io').value = 'funzione B';
}
e logicamente il metodo B è corretto mentre A non funziona..
come ultima prova: myObject.execute = window[rayRel[1]] + '(' + rayRel
[2] + ', ' + rayRel[3] + ');'; mi associa
function provaA(a, b) {
    document.getElementById("io").value = "lol:" + a + b;
}(6, 2);
all'onclick di A.
io davvero non sò più dove sbattere la testa...

 io davvero non sò più dove sbattere la testa...
Hope it helps.



grazie ancora.. domani in ufficio testo il tutto e ti sò dire..
il mio scopo naturalmente non è fare 5+6 (che, come stringhe, vengono
cmq concatenate invece che sommate)
ma avere un metodo per associare l'esecuzione di funzioni a
determinati tag tramite il markup, avendo un'unione tra js, css e
markup xhtml.
mi risulterebbe molto più comodo, secondo me, avere un markup così:
<a rel="jsF.reachIt.pippo">vai a pippo</a>
piuttosto che
<a onclick="reachIt('pippo');">vai a pippo</a> o <a
href="javascript:reachIt('pippo');">vai a pippo</a>
la funzione reachIt te la posto domani insieme al 'tutto', così magari
vista la tua esperienza (se hai voglia/tempo) magari vedi se si può
migliorare (presumo di si, l'ho scritta in fretta e furia)
cmq grazie davvero per tutto!

eccomi qua.. funziona benissimo il tuo metodo!
credo che sia molto comodo poter eseguire delle funzioni js
specificandole in un attributo.. poi tutta questa pappardella fà solo
questo, 'legge' un onclick="..." in un attributo.
cmq ecco il primo 'impiego' della funzione:
<style>
body{
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	color: #252525;
	background-color: #ffffff;
}
div#contents{
	/*
	width: 100px;
	height: 100px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	*/
}
div.myBox{
	color: #000000;
	/*
	width: 100px;
	height: 100px;
	margin: 1px 1px 1px 1px;
	*/
	padding: 0px 0px 0px 0px;
	border-width: 1px 1px 1px 1px;
	border-color: #333333;
	border-style: dashed;
	background-color: #dbdbdb;
	float: left;
	text-align: center;
}
h2{
	color: #FF00AA;
}
</style>
<script language="javascript" type="text/javascript">
var pageW = 800;
var pageH = 500;
var colNum = 3;
var reachX = false;
var reachY = false;
var rowNum = 3;
var mbpCorrection = 3;
var sbCorrection = 20;
var reachTimer;
var ri = new Array();
ri['adjX'] = 0;
ri['adjY'] = 0;
//coe = coefficent speed. higher coe, higher speed.
ri['coeX'] = 0.15;
ri['coeY'] = 0.15;
//coem = alternative coefficent, will be used when the distance is
lower than the nearest value.
ri['coemX'] = 0.27;
ri['coemY'] = 0.27;
//toll = tollerance betweeen the nearest position to the element
before quit the cicle.
ri['tollX'] = 5;
ri['tollY'] = 5;
//higher distance before use teh coem
ri['nearX'] = 120;
ri['nearY'] = 120;
//distances
ri['distX'];
ri['distY'];
ri['distposX'];
ri['distposY'];
ri['moveToX'];
ri['moveToY'];
//debug logs
function buildStructure(){
	var rayScreen = getScreenSize();
	var screenW = Math.round(rayScreen[0] - sbCorrection);
	var screenH = Math.round(rayScreen[1] - sbCorrection);
	//alert('SW1: ' + screenW + ', SH1: ' + screenH);
	var myMarginW = Math.round( ( screenW - pageW ) / 2 );
	var myMarginH = Math.round( ( screenH - pageH ) / 2 );
	ri['adjX'] = myMarginW;
	ri['adjY'] = myMarginH;
	var containerW = Math.round( (screenW + mbpCorrection) * colNum );
	var containerH = Math.round( (screenH + mbpCorrection) * rowNum );
	if(document.all){//ie
		var strCSS = 'rules';
	}else{//ff
		var strCSS = 'cssRules';
	}
	document.styleSheets[0][strCSS][1].style.width = containerW + 'px';
	document.styleSheets[0][strCSS][1].style.height = containerH + 'px';
	document.styleSheets[0][strCSS][2].style.width = pageW + 'px';
	document.styleSheets[0][strCSS][2].style.height = pageH + 'px';
	document.styleSheets[0][strCSS][2].style.margin = myMarginH + 'px ' +
myMarginW + 'px ' + myMarginH + 'px ' + myMarginW + 'px';
	return tagIdentify();
}
function tagIdentify(){
	if(!document.getElementsByTagName){ return; }
	var anchors = document.getElementsByTagName('a');
	for (var i=0; i<  anchors.length; i++){
		var anchor = anchors[i];
		var relAttribute = anchor.getAttribute('rel');
		if(relAttribute != null&&  relAttribute.match('jsF')){
			if(relAttribute.indexOf(".")){
				anchor.onclick = resolveRel;
			}
		}
	}
	return true;
}
function resolveRel(){
	var rayRel = this.getAttribute("rel").split(".");
	rayRel.shift(); // scartiamo il primo valore dell'array
	/* il successivo e` la callback, recuperiamo il riferimento alla
funzione */
	var callback = window[rayRel.shift()];
	// verifichiamo che sia una funzione
	if ( typeof callback == "function" ){
		/* se lo e`, la chiamiamo passando cio` che e` rimasto in rayRel: se
c'e` qualcosa, sono parametri */
		callback.call(window, rayRel);
	}
}
function reachIt(targetElement, ignoreX, ignoreY){
	var myLog = document.getElementById('spun');
	//get the target's properties
	var target = document.getElementById(targetElement);
	var targetPosition = getPos(targetElement);
	var targetLeft = targetPosition[0] - ri['adjX'];
	var targetTop = targetPosition[1] - ri['adjY'];
	//and the actual scroll of the page
	var rayScroll = getScrollXY();
	var scrollY = rayScroll[1];
	var scrollX = rayScroll[0];
	if(ignoreX == 1){ targetLeft = scrollX; }
	if(ignoreY == 1){ targetTop = scrollY; }
	//check the ignores options
	//then calculate the ri['dist']s
	ri['distY'] = targetTop - scrollY;
	ri['distX'] = targetLeft - scrollX;
	if(ri['distY'] < 0){ ri['distposY'] = ri['distY'] * -1;
	}else{ ri['distposY'] = ri['distY']; }
	if(ri['distX'] < 0){ ri['distposX'] = ri['distX'] * -1;
	}else{ ri['distposX'] = ri['distX']; }
	//if the ri['dist'] is minor or equal to the ri['near'] var, i use
the mX/mY ri['coe']
	if(ri['distposX'] <= ri['nearX']){ ri['moveToX'] = Math.round((ri
['distX'] * ri['coemX']) + scrollX);
	}else{ ri['moveToX'] = Math.round((ri['distX'] * ri['coeX']) +
scrollX); }
	if(ri['distposY'] <= ri['nearY']){ ri['moveToY'] = Math.round((ri
['distY'] * ri['coemY']) + scrollY);
	}else{ ri['moveToY'] = Math.round((ri['distY'] * ri['coeY']) +
scrollY); }
	window.scroll(ri['moveToX'], ri['moveToY']);
	//if the distance is minor or equal to the ri['toll'], i assume the ri
['dist'] to 0
	if(ri['distposX'] <= ri['tollX']){ ri['distX'] = 0; }
	if(ri['distposY'] <= ri['tollY']){ ri['distY'] = 0; }
	//if not arrived, repeat the loop
	if(ri['distX'] != 0 || ri['distY'] != 0){
		if(reachTimer){ clearTimeout(reachTimer); }
		reachTimer = setTimeout("reachIt('" + targetElement + "', '" +
ignoreX + "', '" + ignoreY + "')", 0);
	}else{//or end it.
		window.scroll(targetLeft, targetTop);
		if(reachTimer){ clearTimeout(reachTimer); }
		return false;
	}
}
function getScreenSize(){
	var myWidth = 0;
	var myHeight = 0;
	if( typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	}else if( document.documentElement &&
( document.documentElement.clientWidth ||
document.documentElement.clientHeight ) ){
		//IE 6+ in 'standards compliant mode'
		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight;
	}else if( document.body && ( document.body.clientWidth ||
document.body.clientHeight ) ){
		//IE 4 compatible
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight;
	}
	return [myWidth, myHeight];
}
function getPos(targetElement){
	var curtop = 0;
	var curleft = 0;
	var target = document.getElementById(targetElement);
	while (target.offsetParent) {
		curleft += target.offsetLeft - target.scrollLeft;
		curtop += target.offsetTop - target.scrollTop;
		target = target.offsetParent;
	}
	return [curleft, curtop];
}
function getScrollXY() {
	var scrOfX = 0, scrOfY = 0, method = false;
	if( typeof( window.pageYOffset ) == 'number' ){
		//Netscape compliant
		scrOfY = window.pageYOffset;
		scrOfX = window.pageXOffset;
		method = 'A';
	}else if( document.body && ( document.body.scrollLeft ||
document.body.scrollTop ) ){
		//DOM compliant
		scrOfY = document.body.scrollTop;
		scrOfX = document.body.scrollLeft;
		method = 'B';
	}else if( document.documentElement &&
( document.documentElement.scrollLeft ||
document.documentElement.scrollTop ) ){
		//IE6 standards compliant mode
		scrOfY = document.documentElement.scrollTop;
		scrOfX = document.documentElement.scrollLeft;
		method = 'C';
	}
	return [ scrOfX, scrOfY, method ];
}
</script>
<body onload="buildStructure();">
<div id="contents">
	<div id="1" class="myBox"><a rel="jsF.reachIt.2">cliccami - 11111111</
a></div>
	<div id="2" class="myBox"><a rel="jsF.reachIt.3">cliccami - 22222222</
a></div>
	<div id="3" class="myBox"><a rel="jsF.reachIt.4">cliccami - 33333333</
a></div>
	<div id="4" class="myBox"><a rel="jsF.reachIt.5">cliccami - 44444444</
a></div>
	<div id="5" class="myBox"><a rel="jsF.reachIt.6">cliccami - 55555555</
a></div>
	<div id="6" class="myBox"><a rel="jsF.reachIt.7">cliccami - 66666666</
a></div>
	<div id="7" class="myBox"><a rel="jsF.reachIt.8">cliccami - 77777777</
a></div>
	<div id="8" class="myBox"><a rel="jsF.reachIt.9">cliccami - 88888888</
a></div>
	<div id="9" class="myBox"><a rel="jsF.reachIt.1">cliccami - 99999999</
a></div>
</div>
</body>
praticamente, agendo anche solo dal dom, o dal css, o su semplici
strutture xml riesco a manipolare l'ambito di lavoro di ogni elemento
della pagina... credo che sia comodo (poi magari scopro che non serve
a nulla.. non sono molto esperto di js)
la funzione reachIt ti sembra corretta o ci sono delle cappellate qua
e la?
grazie ancora per l'aiuto

 href="javascript:reachIt('pippo');">vai a pippo</a>
Quando si programma in un certo modo non hai nell'uno, nell'altro tipo
di codice. Hai il codice di markup senza alcun informazione circa quel
che deve fare (separi il contenuto dal comportamento). E` da JS che si
va specificare che quel nodo deve avere un certo comportamento.
Inoltre come ti ho detto, buttando tutto in un attributo, sei limitato
dall'avere solo stringhe (se volessi avere parametri complessi sarebbe
impraticabile).
Bada, non vorrei mi fraintendessi. Non sto dicendo che hai "perso" del
tempo nel percorrere questa strada. Proseguendo con lo studio, e anche
la pratica, capirai meglio cosa ti sto dicendo adesso, e probabilmente
non userai piu` questo genere di cose.
Ma in ogni caso hai imparato molte nozioni che ti saranno utili; ed e`
questo il motivo per cui il tempo che hai usato qui e` stato proficuo.
