javascript - 在 js 或 Jquery 中还原 removeAttr

Question

我有一个包含 800 多个 child 的 div，他们有随机 ID。 我想删除该主 div 中的所有 Id 属性，并在事件发生后将其恢复为默认值。

我曾使用 jQuery removeAttr() 方法删除所有 child 的 ID，但我无法将 ID 恢复为默认 ID，因为它们有很多元素，我无法使用 attr() 将它们一一添加。

更新一:
我这样做是因为它是一个包含很多元素的 SVG 动画文件，我想在某些事件上触发动画。
一些声明:
主div是这样的:

<div id="#mainSVG">
<svg>
<g id="random123"></g>
<g id="random235"></g>
<g id="random183"></g>
and so on ...
</svg>
</div>

和我的 js 文件:

$(document).ready(function () {
$(window).scroll(function () {
  let hT = $('.home-anim-1').offset().top,
    hH = $('.home-anim-1').outerHeight(),
    wH = $(window).height(),
    wS = $(this).scrollTop();
  if (wS > (hT + hH - wH)) {
    $("div #el_hXoVA5SDrei_an_ISJE0y5YL *").removeAttr("id")
  }else {
    $("div #el_hXoVA5SDrei_an_ISJE0y5YL *") I want to bring back all ids that are deleted
  }
  });
})

Answer 1

如果您要更改元素的 id，则默认情况下不会在任何地方记住它的旧值。但是，在删除它时，您可以在某处记住它:使用 attr 的 data-* 属性或使用 data 的 jQuery 数据缓存:

// Attribute
theElement.attr("data-original-id", theElement.attr("id")).attr("id", newValue);
// Or jQuery's `data` store
theElement.data("original-id", theElement.attr("id")).attr("id", newValue);

稍后，要恢复它，只需将该值放回原处即可:

// Attribute
theElement.attr("id", theElement.attr("data-original-id"));
// Or jQuery's `data` store
theElement.attr("id", theElement.data("original-id"));

如果在循环中执行此操作，您可以使用它们的回调版本。