2012-03-05 32 views
5

¿Puedo obtener el desplazamiento de un elemento html seleccionado en el código fuente html?obteniendo el offset del elemento html seleccionado relacionado con el código fuente html con js

por ejemplo:

<html> <body> <a href="http://google.com">google</a> </body> <html>

si el usuario seleccione el texto google, me gustaría obtener 40 ya que este es el desplazamiento desde el inicio de la fuente.

Intenté con el objeto Range pero no pude encontrar algo útil con este.

Gracias!

+0

¿qué quiere decir con 'en el código fuente html?' –

+1

¿Por qué necesita este número? –

Respuesta

1
<html> 
<head> 
<script> 
function srcOffset(ele) 
{ 
    alert(document.getElementsByTagName('html')[0].innerHTML.indexOf(ele.id) + ele.id.length + 2); 
    return false; 
} 
</script> 
</head> 
<body> 
<a href="http://www.google.com/" onclick="return srcOffset(this)" id="myLink">Google</a> 
</body> 
</html> 
+0

gracias por su respuesta, pero ¿y si el elemento no tiene id attr? –

+0

Algo sobre el ancla debe ser único, o nunca podrá decir qué enlace en la fuente se llama JS. Puede usar el atributo href si está seguro de que es único en la página y buscar el corchete de cierre después de él. Sin exclusividad, estás deshuesado. – MarkFisher

+0

Bien, intentaré inyectar id attr al nodo de anclaje y así obtener la unicidad para el elemento deseado. Espero que haga el truco. gracias de nuevo. –

-1

esta forma de obtener el desfase usando jQuery

$(document).ready(function() { 
    $("a").click(function() { 
    var offset = $(this).offset(); 
    alert(offset.left); 
     alert(offset.top); 
}); 

});​ 

<html> <body> 
    <a href="http://google.com" class="first">google</a> 
    <a href="http://abc.com" class="second">abc</a> 
    <a href="http://xyz.com" class="third">xyz</a> 
</body> <html>​ 

a.first { position:absolute; 
    left:20px; top:35px; } 
a.second{ position:absolute; 
      left:100px; top:35px; } 
a.third{ position:absolute; 
      left:220px; top:35px; } 

demostración de este ejemplo: http://jsfiddle.net/5YFxH/

+1

gracias por la respuesta rápida, pero esto no es lo que quise decir. Sé cómo posicionar un elemento. pero necesito su compensación en el código html en sí. la cantidad de caracteres desde el inicio del código fuente html. lo siento si no estaba claro. alguna idea para este? –

1

realmente no se puede hacer esto de una manera sensata. El problema fundamental es que no hay forma en que los navegadores recuperen el HTML original enviado por el servidor; innerHTML a menudo es diferente de alguna manera porque es una representación del DOM del navegador analizado desde el HTML original en lugar de un fragmento del HTML original.

Es posible recuperar información sobre la selección del usuario en todos los navegadores principales pero esta información se expresa en términos de nodos en el DOM del navegador en lugar de desplazamientos relativos a una cadena que contiene el HTML original enviado por el servidor.

En todo caso, su mejor opción es recuperar la fuente HTML de nuevo a través de Ajax y realizar análisis HTML complicados para hacer coincidir el DOM del navegador con la cadena HTML, que no es trivial. También podría ser imposible si el script que se ejecuta en su página ha modificado el DOM en el momento en que recibe la fuente HTML. Sugiero tratar de encontrar otra forma de lograr lo que quieres.

+0

Encontré otra manera de lograr lo que quiero. ¡Muchas gracias por su respuesta! –

Cuestiones relacionadas