任何一种简单的方法都可以将带有onload的元素作为目标

Any easy way to target an element with onload within that onload?

本文关键字：元素 onload 目标 简单 方法 都可以 任何一      更新时间：2023-09-26

假设您想用JS使元素变蓝，如下所示：

<p onload="this.style.color = 'blue'">Boy, I sure do wish I was blue</p>

上面的行不起作用，因为this针对的是该上下文中的窗口对象。你可以使用身份证，但我想还有更好的方法。

那么，就像标题所说的那样，有没有什么简单的方法可以在onload中针对带有onload的元素？请注意，当页面中有多个具有onload属性的元素时，这样的解决方案必须有效。

您必须使用JavaScript。

您可能希望排除window和iframe元素，但这应该让您开始。

// Get the list of elements with an `onload` attribute
var list = document.querySelectorAll("[onload]");
// Loop through those  elements
for(var i = 0; i < list.length; i++) {
  var el = list[i];
  // Get the value of `onload`
  var v = el.getAttribute("onload");
  console.log(v);
  // Once you have `v` you need to call it... with something like:
  var func = new Function(v);
  func.call(v);  // This should set `this` properly.
}

不幸的是，onload属性只会加载在body或iframe元素上，而不会加载在任意元素上。

我建议您将"this"发送到一个函数，然后该函数将对元素执行您想要的操作。

function change(e){ e.style.color = 'blue'; }
<p onload="change(this);">Boy, I sure do wish I was blue</p>

虽然不是完美的答案或解决方案，但它对我来说效果很好。注意，我不知道这是否适用于所有浏览器。

相关文章：