Javascript函数仅适用于第一个元素

我在foreignObject内部制作了一个可编辑的div，并制作了一个函数，可以根据其中可编辑div的高度和宽度更改foreignObject的高度和宽度。但问题是该函数只对第一个元素起作用，而不是对具有相同类的所有元素起作用。请看一下我的代码

d3.选择（窗口）。打开（“输入”，功能（e）{
var wd=document.querySelector（“.myDiv”）.scrollWidth；
var hd=document.querySelector（“.myDiv”）.scrollHeight；
document.querySelector（“.frobj”）.setAttribute（“宽度”，wd）；
document.querySelector（“.frobj”）.setAttribute（“高度”，hd）；
})
正文
正文
正文

您只是选择了第一个。要选择所有需要使用的内容，请使用queryselectoral（）

以下是一个完整的工作示例

您需要使用

.querySelectorAll（）

，然后使用

forEach（）

循环每个回调函数，然后在回调函数内进行调整

d3.选择（窗口）。打开（“输入”，功能（e）{
document.queryselectoral（“.frobj”）.forEach（el=>{
var wd=el.querySelector（“.myDiv”）.scrollWidth；
var hd=el.querySelector（“.myDiv”）.scrollHeight；
el.setAttribute（“宽度”，wd）；
el.setAttribute（“高度”，hd）；
});    
})
正文
正文
正文

.querySelector（）

只返回第一个匹配的元素。您可以使用

.querySelectorAll（）

返回元素列表。然后，您可以遍历列表以分别对每个元素进行操作。您可以制作一个工作代码吗，因为我使用了.querySelectorAll，但当我们使用它时它不工作。您可以制作一个工作代码吗，因为我使用了.querySelectorAll，当我们使用它时，它不起作用。您需要使用一个循环对每个循环进行迭代，然后设置属性。您知道循环是如何工作的吗？如果没有，我建议你先看看。querySelectorAll将返回一个节点列表。为了访问每个单独的元素，您需要使用循环（即：foreach）进行迭代。然后你可以在里面设置你的值