Question

我想不在我的svg中显示所有白色填充路径。

想象一下这个结构的svg：

<svg>
     <path class="pathok"fill="rgb(29,233, 182)"/>
     <path class="pathok" fill="rgb(255, 255, 255)" />
     <path class="pathok" fill="rgb(255, 255, 255)" />
     <path class="pathok" fill="rgb(255, 255, 255)"/> 
</svg>

我试过这个但是没有用：

<script>
   if ($("path").attr("fill") == ("rgb(255, 255, 255)")) {
        $(this).css("display","none")
   }
</script>

一般来说，我如何根据他的属性值选择标签？

Answer 1

您的选择器获取所有路径，而不是单个路径。

试试这个：

$(document).ready(function(){
    var $paths = $('path'); // Get all paths
    for (var i=0;i<$paths.length;i++){ // Iterate through each one
        var $path =$($paths[i]); // This gets a single path
        if ($path.attr("fill") == ("rgb(255, 255, 255)")) {
            $path.css("display","none");
        }
    }
});

Answer 2

您可以直接选择所需的元素，不需要循环。

我使用了rect元素而不是路径，因为你没有提供和d属性，但原理是相同的。

$("rect[fill='rgb(255, 255, 255)']").css('display', "none");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<svg>
     <rect width="90" height="30" fill="black"/>
     <rect width="10" height="10" x="10" y="10" fill="rgb(29,233, 182)"/>
     <rect width="10" height="10" x="30" y="10" fill="rgb(255, 255, 255)" />
     <rect width="10" height="10" x="50" y="10" fill="rgb(255, 255, 255)" />
     <rect width="10" height="10" x="70" y="10" fill="rgb(255, 255, 255)"/> 
</svg>

使用jquery通过填充颜色选择Svg Path

2 个答案: