【d3基础教程】第一篇---选择元素

选择器方法接受W3C选择器字符串，例如：.fancy来选择类名为fancy的元素，或者div来选择标签名为div的元素。选择器方法有两种形式：select和selectAll。

• d3.select(selector)仅仅会选择匹配的第一个元素。(接受的参数可以为字符串，也可以为具体的节点)

<p>123</p>
<p>234</p>
<p>345</p>

<script>

    let p = d3.select('p')
            .style('color', 'red')

</script>

d3.selectAll("p").on("click", function() {
  d3.select(this).style("color", "red");
});

//this 表示当前节点

 

将第一个p标签文字颜色修改为红色。

• d3.selectAll(selector)会按照文档中的顺序选择所有的元素。 （接受的参数可以为字符串，也可以为伪数组）

<p>123</p>
<p>234</p>
<p>345</p>

<script>

    let p = d3.selectAll('p')