p5.js | selectAll()函数

selectAll()函数是p5.js中的一个函数，它用于选择HTML中符合指定CSS选择器的所有元素。使用selectAll()函数可以方便地对多个元素进行操作。

用法

selectAll()函数用法如下：

let elements = selectAll(selector);

其中，selector是一个CSS选择器，用于指定选中哪些元素。

elements是一个数组，包含了所有符合选择器条件的HTML元素。

示例

假设我们有如下HTML结构：

<div class="box"></div>
<div class="box"></div>
<div class="box"></div>

我们想要选中所有class为“box”的元素，并将它们的背景色改为红色，可以使用如下代码：

function setup() {
  let boxes = selectAll('.box'); // 选择所有class为“box”的元素
  for (let i = 0; i < boxes.length; i++) { // 遍历所有元素
    boxes[i].style('background-color', 'red'); // 将背景色改为红色
  }
}

可以看到，selectAll()函数选择了所有class为“box”的元素，将它们的背景色改为了红色。

小结

selectAll()函数是p5.js中用于选择HTML元素的函数，它支持使用CSS选择器进行匹配，可以方便地对多个元素进行操作。在p5.js中，selectAll()函数常常用于绘制以及交互等相关操作。