jQuery使用.attr()为元素添加onload属性不生效如何解决

代码不生效是三个问题叠加导致的：

• jQuery的.attr()用法写错了：第一个参数应该传纯属性名，你写的是'onload='，多带了一个末尾等号，相当于要给元素加一个名为onload=的非法属性，自然达不到预期。
• 选择器匹配不到目标元素：你写的选择器是.cad .et_pb_row .field__items，要求匹配类名为cad的元素内部的.et_pb_row节点，但你贴出的HTML里.et_pb_row外层并没有带cad类的祖先元素，jQuery根本选不到要操作的div。
• 最核心的逻辑问题：普通div元素不支持onload事件。onload是专门给会加载外部资源的元素设计的，比如<img>、<script>、<iframe>、<link>以及<body>，普通div渲染到页面的过程不会触发load事件，就算你把属性正确加上去，浏览器也不会执行绑定的函数。

不要尝试给div加onload属性，根据实际场景选对应写法即可：

1. 如果目标元素是页面初始就写在HTML里的静态内容，直接等DOM加载完成后调用目标函数即可，不需要等元素onload：

// DOM加载完成后执行
$(function() {
  // 修正选择器，匹配目标元素
  const targetEl = $(".et_pb_row .field__items")[0];
  if (targetEl) {
    // 直接调用函数，传入元素对象
    startMoving(targetEl);
  }
})

2. 如果目标元素是后续通过接口请求、动态渲染插入到页面的，就在元素插入DOM的逻辑之后直接调用startMoving(对应元素)即可；如果没法控制插入逻辑，可以用MutationObserver监听DOM变化，等目标元素出现后再触发函数。
3. 如果你要等元素内部的图片、视频等资源全部加载完成再执行函数，就等window.load事件触发后再调用上述逻辑，或者单独监听元素内部所有资源的加载完成状态。

内容的提问来源于stack exchange，提问作者Frazer Cook