contentDocument en jQuery

Question

Tengo el siguiente script js para acceder a los elementos dentro de un objeto (SVG - <object data="bbbbbb.svg" type="image/svg+xml" id="alphasvg" width="100%" height="100%"></object> )

jQuery(document).ready(function($) { 

    $(window).load(function() { 


     var a = document.getElementById("alphasvg"); 
     var svgDoc = a.contentDocument; 
     var delta = svgDoc.getElementsByTagName("path");  
     $(delta).click(function() { 

      //do stuff 

     }) 

    }); 
}); 

quiero usar jQuery para acceder a los elementos y las etiquetas. Estoy completamente atrapado en la parte contentDocument. ¿Cómo puedo convertir esto a jQuery para poder usar attr, etc.?

Deseo poder acceder y modificar atributos en jQuery en lugar de tener que usar los métodos js tradicionales con los que no estoy familiarizado.

¿Cómo alguien puede ayudarme?

Gracias a un millón.

Answer 1

Usted debe ser capaz de acceder a los caminos directamente como elementos, sin necesidad de contentDocument o getElementsByTagName, etc:

jQuery(document).ready(function($) { 

    $(window).load(function() { 

     $("#alphasvg path").click(function() { 

      //do stuff 
      // $(this).attr('d') = the path 

     }) 

    }); 
}); 

Answer 2

De esta manera:

$(svgDoc).find("whatever").doWhatever(); 

Demo here y code here. Tenga en cuenta que he usado un para la demostración, por lo tanto, la primera URL funcionará, la segunda le dará un error de "permiso denegado" si intenta ejecutar el violín.

Answer 3

Si está incrustando SVG en HTML usando la etiqueta del objeto (en contraposición a inline SVG), esto, entonces esto es un duplicado de una pregunta anterior, la respuesta a la que se puede encontrar aquí: How to access SVG elements with Javascript