JQuery and SVG - how to find the 'g' tag

问题

Imagine this:

<svg>
    <g id="node1" class="node"></g>
    <g id="node2" class="node"></g>
</svg>

How can I find the 'g' tag, I want that all tags could be clicked, and not just 'node1' or 'node2'. I've tried simular to this, but could not get it work.

$('g').click(function(){
    alert("Hellooooo");
});

回答1:

Use find() method for more info visit this

For eg $("body").find("p").css("background-color","#f00"); sets all body's <p> element background-color to red.

For your question try this:

$("svg").find("g").click(function(){

// your jquery code here

}
);

回答2:

Thanks to C-Link I've solved this.

To be sure only the nodes are clickable I've wroted:

$("svg").find("g.node").click(function(){
    alert("Lolol");
});

And it works fine.

来源：https://stackoverflow.com/questions/17043318/jquery-and-svg-how-to-find-the-g-tag