有什么方法可以替换 Javascript 中已弃用的 CustomEvent.initCustomEvent() 吗？

Question

已弃用的 CustomEvent.initCustomEvent() 如何替换以改进旧代码。

Answer 1

谷歌搜索 \xe2\x80\x9cJS initCustomEvent deprecated\xe2\x80\x9d将找到几个相关结果，包括相关文档。

\n

MDN 上的文档非常清楚：

\n

\n

不要使用该功能，而是使用特定的事件构造函数，例如。\n有关创建和触发事件的CustomEvent()页面提供了有关如何使用这些事件的更多信息。

\n

\n

后一个链接包含标题为“老式方式”的部分，其中准确显示了旧 API 的使用方式以及现代 API 的用法。

\n

请注意，initEvent许多相关方法已被弃用，就像initCustomEvent、initMessageEvent、initUIEvent等。 \n那里的文档说（没有粗体格式和冗余链接）：

\n

\n

不要再使用此方法，因为它已被弃用。

\n

而是使用特定的事件构造函数，例如Event().\n[\xe2\x80\xa6]

\n

\n

另请参阅部分还链接到：

\n

\n

使用构造函数来代替此已弃用的方法：Event()。也可以使用更具体的构造函数。

\n

\n

initEvent和之间的唯一区别initCustomEvent是后者接受一个附加detail参数。\n它们在其他方面的用法是相同的。\ndocument.createEvent实例化一个新的 Event 对象，但由于可以使用它们的构造函数，现在它\xe2\x80\x99 基本上已经过时了。 \ndocument.createEvent("CustomEvent")创建一个CustomEvent， 也是如此document.createEvent("customevent")：字符串不区分大小写，支持的事件接口的完整列表由 WHATWG 指定，并document.createEvent("Event")创建一个通用Event对象。

\n

该文档提供了如何使用 的示例initCustomEvent。\n您可以将其与现代 API 的用法进行比较CustomEvent。

\n

不推荐使用的初始化自定义事件的方法：

\n

const event = document.createEvent("CustomEvent");\n\nevent.initCustomEvent(type, canBubble, cancelable, detail);\n

\n

使用这个代替：

\n

const event = new CustomEvent(type, { bubbles, cancelable, detail });\n

\n

无论哪种情况，为了侦听并分派它，此代码保持不变：

\n

eventTarget.addEventListener(type, eventListener);\neventTarget.dispatchEvent(event);\n

\n

在这两个例子中，

\n

\n
• event将是一个CustomEvent,
\n
• type是一些代表事件类型的字符串，例如switchLampOn或者animalCall其他什么，
\n
• detail是与事件关联的一些自定义数据\xe2\x80\x8a\xe2\x80\x94\xe2\x80\x8a可以是任何内容\xe2\x80\x8a\xe2\x80\x94，
\n
• eventTarget是一些EventTarget,
\n
• eventListener是某个函数或EventListener.
\n

\n

canBubble和cancelable是已弃用方法中的布尔参数。\nbubbles和是现代方法中对象cancelable的布尔属性。\n该对象是构造函数的第二个参数。CustomEventInitCustomEventInitCustomEvent

\n

有关 \xe2\x80\x9cbubbling\xe2\x80\x9d\xe2\x80\x8a\xe2\x80\x94\xe2\x80\x8a 和 \xe2\x80\x9ccapturing\xe2\x80\x9d\xe2\ 的更多信息x80\x8a\xe2\x80\x94\xe2\x80\x8a的意思是，请参阅MDN：事件冒泡和捕获和堆栈溢出：什么是事件冒泡和捕获？.\n有关 \xe2\x80\x9ccancelable\xe2\x80\x9d 功能的更多信息，请参阅MDN：Event.prototype.cancelable属性, preventDefault。

\n\n\n

历史简要概述：

\n

曾经有一段时间，DOM 没有被指定，但是旧的 Internet Explorer 和 Netscape 在事件方面做了自己的事情。\n这个时代的实际实现被非正式地称为 \xe2\x80\x9cDOM Level 0\xe2\x80\x9d 。

\n

\n
• DOM Level 1 在 1998 \xe2\x80\x93 2000 中指定，但将指定事件模型推迟到未来的规范。
\n
• DOM Level 2 介绍initEvent等。2000年。
\n
• DOM Level 3，于 2004 年完成引入CustomEvent。
\n
• 当前的 DOM Level 4 使所有Event界面都可构造，渲染createEvent已过时。
\n

\n