contentDocument in jQuery

I have the following js script to access elements inside a object (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

        })

    });
});

I want to use jQuery to access the elements and tags. I'm completely stuck on the contentDocument part. How can I convert this to jQuery so I can use attr etc?

I want to be able to access and modify attributes in jQuery instead of having to use the traditional js methods which I am unfamiliar with.

How someone can help me?

Thanks a million.

---

You should be able to access the paths directly like elements, no need for contentDocument or getElementsByTagName, etc:

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

    $(window).load(function () {

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

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

        })

    });
});

---

Like this:

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

Demo here and code here. Note that I've used an <iframe> for demonstration hence the first URL will work, second will give you "permission denied" error if you try to run the fiddle.

---

If you are embedding SVG into HTML using the object tag (as opposed to inline SVG), this then this is a duplicate of a previous question, the answer to which may be found here: How to access SVG elements with Javascript