2 回答

TA贡献1786条经验 获得超11个赞
好的,就是这样:也许你应该等待文档被加载,似乎你可以用 DOMContentLoaded evenListener 来完成,然后在 onready 回调中你可以执行你的点击函数:见下面的例子
DOM 在 ES6 中没有改变,ES6 给了 JavaScript 新的特性,仅此而已。在纯 js 中,dom 加载的存在事件它是从 jquery 等价物准备好的文档
document.addEventListener("DOMContentLoaded",function(){ //do something here });
使用 DOM 树的模块可以在里面有监听器,或者应该在 dom 准备好后使用。我创建了示例 DOM 函数来说明我的意思:
var DOM=function(selector){
document.addEventListener("DOMContentLoaded",()=>{
this.element=document.querySelector(selector);
if (typeof this.callback === 'function')
this.callback();
});
};
//HERE WE HAVE CALLBACK WHEN OUR MODULE CAN BE USED
DOM.prototype.onReady=function(callback){
this.callback=callback;
};
DOM.prototype.getElement=function(){
//example object method
return this.element;
};
DOM.prototype.click=function(){
return this.element.click
};
用法示例:
document.querySelector(".glyphsSpriteSafari__outline__24__grey_9").click();
var d=new DOM("div._9AhH0");
firstPicture.onReady(()=>{
firstPicture.click();
});
//your other code
模块应该独立于 DOM,创建直接导出 DOM 元素的模块是非常错误的做法。所以它可以通过两种方式完成:
模块应该在属性中获取选择器 DOM 对象,并且应该在 DOM 准备好后调用。所以你的模块不知道在哪里被调用,但它需要准备好的 DOM 结构。在这种情况下,DOM 就绪回调仅在使用模块并调用它们的主文件中。
模块可以有一些 DOM 就绪侦听器,但我们还需要一些信息何时可以使用模块(我在示例和 onReady 函数中展示了这种情况)。
添加回答
举报