Javascript JS脚本，仅在目标页面中操作DOM，无需编程方法

我创建了一个vanilla JS脚本来操作按钮点击时的一些DOM元素（旋转木马组件中的项目）

我的目标是能够在使用HTML模板的目标页面中导入脚本，并注入脚本的逻辑来浏览库项目。这不需要以编程方式创建脚本实例或从模板本身调用任何方法

其思想是实现与某些引导组件相同的行为，其中模板CSS类和JavaScript之间的匹配在幕后完成。脚本和模板将作为npm软件包导出，因此我想请求确认：

1-考虑到将脚本导出为npm包的最终目标，将整个登录打包在“module.exports”中是一种好方法还是有更好的方法

2-有没有比听

DOMContentLoaded

更好的方法来确保在运行脚本之前加载DOM内容

脚本

module.exports = (function () {

   document.addEventListener('DOMContentLoaded', gallery, false);

   function gallery() {
        'use strict';    

        const rootGalleryElements = document.querySelectorAll(".gallery-root");

        // Here all the logic to manipulate the DOM on buttons click (below)

        prevButton.addEventListener("click", (event) => { showPreviousItems(event) }, false);
        nextButton.addEventListener("click", (event) => { showNextItems(event) }, false);

    }
})();

模板

<div class="page-content">
    <div class="gallery-root">
     ...
    </div>
</div>

...