javascript - ResizeObserver:如何获取大小调整后的元素的ID？

我正在用ResizeObserver观察多个文本区域。 “ for（允许条目的条目）”循环枚举了所有条目，但我只需要已调整大小的元素的ID。我尝试了this.id，但未定义。

var myObserver = new ResizeObserver(entries => {

console.log(this.id);
  for (let entry of entries) {
    // do something
  }
});

var boxes = document.querySelectorAll('textarea');
boxes.forEach(box => {
  myObserver.observe(box);
});

最佳答案

多个文本区域可能会同时更改/调整大小，因此需要使用数组来跟踪每个更改。但是，大多数情况下，只有一个元素会调整大小。在这种情况下，您可以从entries中获取第一个元素，并获取其target.id值：

const myObserver = new ResizeObserver(entries => {
  const [changed] = entries;
  console.log(changed.target.id);
});

const boxes = document.querySelectorAll('textarea');
boxes.forEach(box => {
  myObserver.observe(box);
});

<textarea id="1">1</textarea>

<textarea id="2">12</textarea>

<textarea id="3">123</textarea>

关于javascript - ResizeObserver:如何获取大小调整后的元素的ID？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/58523267/