How can I access the inner elment from svg image using jquery? -
i want access inner element of svg image .
the following svg image file
<div id="selectable_images" class="selected"> <ul> <li> <div class="icons"> <svg xmlns="http://www.w3.org/2000/svg" height="512" version="1.1" viewbox="0 0 412 412" width="412"> <path id="53" d="m4 194 c0 0 -1 0 -1 -1 0 -1 -1 -1 -1 -1 -2 1 -2 -6 -2 -54 0 -33 0 -55 1 -55 0 0 2 0 3 1 2 1 3 2 3 4 0 3 1 4 5 4 4 0 4 0 3 -2 -1 -1 -2 -2 -1 -2 0 -1 2 -1 2 0 1 0 2 1 2 2 0 0 1 1 2 1 0 0 1 -1 1 -1 0 -1 0 -1 1 0 0 1 1 3 0 4 0 1 -1 2 -1 2 0 0 -1 1 -1 3 0 3 0 3 1 1 1 -1 2 -2 2 -3 0 -1 0 -1 0 -2 1 0 1 1 1 2 1 2 2 2 3 1 2 0 2 0 1 1 -1 1 -1 2 -1 2 0 0 2 0 4 0 2 0 4 1 4 2 1 1 1 3 1 4 0 1 0 2 1 2 0 -1 2 0 3 1 2 2 2 3 2 3 -1 0 -2 1 -3 2 -1 1 -1 1 0 1 1 0 1 0 0 1 -2 1 -2 1 0 3 1 1 2 3 2 5 -1 2 -1 4 -1 4 0 0 2 0 4 1 2... 1 0 0 0 0 1 -1 2zm23 76 c0 0 -1 0 -2 -1 -1 -1 -1 -1 0 -1 1 0 2 0 3 1 0 1 0 1 -1 1zm128 17 c-1 0 -1 0 0 -1 0 -1 0 -1 1 -1 0 0 0 0 0 1 0 1 0 1 -1 1zm131 10 c0 0 -2 -1 -3 -1 -1 -1 -2 -2 -1 -2 0 0 1 1 3 1 1 1 1 2 1 2zm192 9 c0 0 0 -1 1 -1 0 -1 0 -2 -1 -2 -1 0 -2 0 -2 1 1 1 0 1 0 0 -1 0 -2 -1 -2 -1 1 0 2 0 4 -1 3 0 3 0 2 2 -1 1 -1 2 -2 2zm133 8 c0 0 -2 -1 -4 -2 -2 -1 -3 -1 -5 0 -2 1 -4 1 -6 1 -3 -1 -3 -1 1 -1 3 0 4 0 3 -1 -1 0 0 -1 3 -1 3 0 5 1 7 2 1 1 2 2 1 2zm254 1 c-1 0 -2 0 -1 -1 0 0 2 0 2 0 1 1 0 1 -1 1z"> </svg> </div> </li> <li> <div class="icons"> <svg xmlns="http://www.w3.org/2000/svg" height="512" version="1.1" viewbox="0 0 412 412" width="412"> <path id="54" alt="image1" d="m234 161 l-234 0 0 -80 0 -81 234 0 233 0 0 81 0 80 -233 0z m-232 -1 c1 0 1 0 1 0 0 -1 0 -1 -1 -1 -1 -1 -1 -1 -1 0 0 1 0 1 1 1z m86 0 l9 0 0 -4 c-1 -3 -1 -5 0 -5 0 -1 5 -2 10 -2 8 0 11 0 12 -1 1 -2 1 -2 1 0 1 1 1 2 0 2 0 1 0 3 0 5 l1 4 0 -3 c1 -2 2 -4 3 -5 1 -1 2 -1 3 -2 1 0 2 1 3 1 0 1 0 1 -1 1 -1 -1 -1 0 -1 1 0 1 0 1 -1 0 -1 -1 -2 -1 -2 0 0 0 0 1 0 1 0 1 0 2 -1 3 -1 1 0 2 1 3 2 1 7 1 19 1 17 0 17 0 18 -3 0 -1 1 -2 2 -2 0 0 1 0 2 0 1 -1 2 -2 2 -2 -1 0 0 -1 2 0 1 0 2 -1 3 -1 0 -1 -1 -1 -1 -1 -1 0 -2 0 -2 -...1 2 2 1 1 1 2 1 2zm12 154 c0 0 0 -1 0 -3 0 -2 0 -3 2 -2 2 0 2 0 0 2 -1 2 -2 3 -2 3zm4 147 c-1 0 -1 0 -1 -1 0 -1 0 -1 1 0 1 0 1 0 1 1 0 0 0 0 -1 0zm35 141 c-1 0 -2 -1 -2 -2 -1 -1 -1 -1 1 0 1 1 2 2 2 2 0 0 0 0 -1 0zm22 140 c0 0 0 -1 0 -1 -1 -1 0 -2 0 -1 1 0 2 0 2 -1 0 -1 1 -1 3 -1 2 1 2 1 -1 2 -2 1 -3 2 -4 2zm9 138 c0 0 -1 0 -2 -1 0 -1 0 -1 0 -2 1 0 1 0 1 1 0 0 1 1 2 0 1 0 1 0 1 1 -1 0 -2 1 -2 1zm17 136 c0 0 0 0 0 -1 0 -1 0 -1 1 -1 1 0 1 0 1 1 -1 1 -1 1 -2 1zm280 6 c-1 0 -1 0 0 -1 1 0 1 0 2 0 0 1 -1 1 -2 1z"> </svg> </div> </li> </ul> </div>
i have tried not succeeded .i needed extract id , d attributes of svg images .could 1 me?
.attr() documentation
$('element').attr('attributes name')
gets value of attribute.
this code work
$('svg path').attr('id'); $('svg path').attr('d');
after op
's comment
$("#selectable_images svg").click(function () { var $this = $(this); var path = $this.find('path'); var id =path.attr('id'); var d = path.attr('d'); alert('id ='+id); alert('d='+d); });
Comments
Post a Comment