javascript - 如何在 DOM 更改后获得相同的 ID、值或文本

Question

我想知道是否一个 div 的 id 是 1 并且有人将 id 更改为 34，当有人点击它时 attr('id') 仍然等于 1 即使在更改而不是 34 之后。为我的英语道歉谢谢你。

        $(document).on('click','.edit_btn:eq(0)',function(){
            var itm_id = $(this).siblings('input').attr('id');
            alert(itm_id);

        });

希望 id 等于 1 而不是 34，即使有人用 DOM 更改它也是如此

Answer 1

您可以使用 MutationObserver 来查看属性是否更改，然后再将其更改回来。确保当您将其改回时，它知道忽略该更改。否则您会使浏览器滞后。请注意，任何使用开发工具的猴子都可以禁用此功能。

不要依赖客户端。

let i = 0;
const MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;

let e = document.querySelector('#test');
setInterval(() => {
  i++;
  // Change
  e.setAttribute('id', i);
}, 1000); // Loop Sleep

let observer = new MutationObserver((mutations) => {
  mutations.forEach((mutation) => {
    if (mutation.type === "attributes") {
      if (e.id !== 'test') {
        let previous = e.id;
        // Revert
        e.setAttribute('id', 'test');
        console.log('Changed to test from', previous)
      }

    }
  });
});

observer.observe(e, {
  attributes: true
});

<div id="test">Test</div>