我在我的 HTML JavaScript 中创建了一个自定义按钮。虽然它按预期在 Chrome 上运行,但在 Safari 上却失败了。既不会调用构造函数,也不能自己调用方法“MyMethod”。我想念什么?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Button Element Example</title>
</head>
<body>
<button is="myown-element-button">Click me!</button>
<script>
// Define the custom button element
class MyButton extends HTMLButtonElement {
constructor() {
super();
this.addEventListener("click", this.myMethod);
}
myMethod() {
console.log("Hello from MyButton!");
}
}
customElements.define("myown-element-button", MyButton, { extends: "button" });
// Create a new custom button element
const myButton = document.createElement("button", { is: "myown-element-button" });
myButton.textContent = "Click me too!";
document.body.appendChild(myButton);
myButton.myMethod();
</script>
</body>
</html>