ResizeObserver：如何檢索調整大小元素的 Id？

Question

我正在使用 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);
});

Answer 1

多個文本區域可以同時更改/調整大小，因此需要使用數組來跟蹤每個更改。 然而，大多數時候，只有一個元素會調整大小。 在這種情況下，您可以從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>