d3之选择器篇

id选择器

id选择器类似于css,前面加#即可。

        
hello
        
d3
        
world

效果如图：

p1.png

类选择器

类选择器也与css有类似之处，通过点(.) 加类名的方式选择，但是与css不同的是d3.select('.类名')只能选到第一个元素，如果想要选择此类名的所有元素需要加上All，即d3.selectAll('.类名')

        
hello
        
d3
        
world


        
hello
        
d3
        
world

d3.select时:

p2.png

改将d3.select改为d3.selectAll后,所有的元素都被选中了。

p1.png

标签选择器，属性选择器等

标签选择器，属性选择器等都与上面的类选择器相似，如果想要选中所有的元素必须要用selectAll，不再赘述。

子级选择器

最后说下子级选择器，d3支持链式选择。

        
hello
        
d3
        
world


        
hello
        
d3
        
world


        
hello
        
d3
        
world

如图：

p3.png

好啦，小编觉得选择器学到这里就OK啦，基本满足所需~