変更セレクタ

Question

からSVGのプロパティ私はこのSVGを持っており、ポリゴンはIDが 'UNO'

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" 
     width="1641px" height="820px" viewBox="0 0 1641 820" enable-background="new 0 0 1641 820" xml:space="preserve"> 
    <polygon id="uno" fill="#ff6600" fill-opacity="0" stroke="" stroke-miterlimit="10" points="350,228 579,102 603,240 713,292 722,343 744,354 650,433 
     651,482 633,496 592,477 541,516 473,465 462,420 399,383 358,236 "/> 

を持っている私は、この

$("#uno").on({mouseenter: function(){ 
    this.style.stroke = '#FF6600'; 
    this.style['stroke-width'] = 3; 
    this.style['fill'] = '#ff6600'; 
    this.style['fill-opacity']=.5; 
    } 
}); 

しかし、なぜを行う場合、私はプロパティを変更することができますこれをしても動作しません。

$('#uno').style.stroke = '#FF6600'; 
    $('#uno').style['stroke-width'] = 3; 
    $('#uno').style['fill'] = '#ff6600'; 
    $('#uno').style['fill-opacity']=.5; 

オブジェクトは、セレクタが動的であるときに関数を持つことです。例えば。

$("#dos").on({mouseenter: function(){ animar(#uno);  } 
}); 

    function animar(a){ 
    a.style.stroke = '#FF6600'; 
    a.style['stroke-width'] = 3; 
    a.style['fill'] = '#ff6600'; 
    a.style['fill-opacity']=.5; 
} 

Answer 1

this$(this)はjqueryのであるが、ジャバスクリプトオブジェクトです。

このようにすると機能します。

function animar(a){ 
    a.style.stroke = '#FF6600'; 
    a.style['stroke-width'] = 3; 
    a.style['fill'] = '#ff6600'; 
    a.style['fill-opacity']=.5; 
} 

// if you can add clas 
$(".js-svg-anmiate").on('mouseenter' function(){ 
     animar(this); 
}); 

// if you cant add class 
$("#uni, #doit").on('mouseenter' function(){ 
     animar(this); 
});