javascript - 如何让旧的 jquery 版本访问 SVG 元素

Question

我无法在应用程序上使用 jquery 1.11.3，但 jquery 1.11.3 似乎不想访问 SVG 中的元素。这可能吗。我不明白为什么不。

使用 Jquery 1.11.3 - 不起作用(更新，现在使用版本 1.12.4 并且它可以工作)

http://codepen.io/omarel/pen/zNMJOJ

使用 jquery 3.1 - 有效

http://codepen.io/omarel/pen/XpyBOq

更新:感谢@Rikin，我意识到我可以使用版本 1.12.4，它开始向 SVG 添加类名，幸运的是这个版本适用于我正在处理的应用程序。

JQUERY

 $( ".amenitylink" ).on( "click", function() {
  $('svg #lobby').toggleClass("highlight");
 });

HTML

 <div class="amenitylink">click me</div>

 <svg version="1.1" id="main" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="276px" height="210px" viewBox="0 0 276 210" style="enable-background:new 0 0 276 210;" xml:space="preserve">
<style type="text/css">
 <![CDATA[
.st0{fill:none;stroke:#FFFFFF;stroke-width:11;stroke-miterlimit:10;}
]]>
</style>
 <rect id="lobby" x="13" y="17" class="st0 " width="240" height="179"/>
 </svg>

CSS

 body {
 background-color:#000;
 color:#fff;
 }
.amenitylink {
cursor:pointer;
padding:10px;
border:1px solid white;
 }
 .highlight {
    fill:rgba(134, 117, 77, 0.4) !important;
}

Answer 1

如上文 v1.11.3 所述 - 它确实以 SVG 元素为目标，但未能在其中添加类名。当我调试时，它显示了类似这样的内容 [object SVGsomething] highlight

SVG 元素类添加已在 ~1.12.4 库中解决，您可以使用它来解决您的问题。