refactor: 调整utlis为一个js对象，减少全局变量污染

layout/_global/head.ejs

@@ -68,7 +68,7 @@ var icon = full_url_for(theme.favicon || config.favicon)
 <script src="<%= theme.CDN.utlis %>"></script>
 <script>
   (function() {
-    var html = $query('html')
+    var html = mengd.$query('html')
     var isDark = localStorage.isDark === 'true'
     if (isDark) html.setAttribute('theme', 'dark')
     else html.removeAttribute('theme')

layout/_partial/third_party/comment/discuss.ejs

@@ -2,7 +2,7 @@
 <div id="Discuss-Comments"></div>
 <script>
   function LoadDiscuss() {
-    getScript('<%- theme.discuss.source %>', function() {
+    mengd.getScript('<%- theme.discuss.source %>', function() {
       let initData = {
         el: '#Discuss-Comments',
         serverURLs: '<%- theme.discuss.serverURLs %>',

layout/_partial/third_party/comment/twikoo.ejs

@@ -2,7 +2,7 @@
 <div id="tcomment"></div>
 <script>
 function LoadTwikoo(){
-  getScript("<%-theme.twikoo.source%>",function(){
+  mengd.getScript("<%-theme.twikoo.source%>",function(){
     initData = {
       el: '#tcomment',
       envId: '<%-theme.twikoo.envId%>',

layout/_partial/third_party/comment/valine.ejs

@@ -2,7 +2,7 @@
 <div id="vcomments"></div>
 <script>
 function LoadValine() {
-    getScript("<%-theme.valine.source%>", function () {
+    mengd.getScript("<%-theme.valine.source%>", function () {
         let initData = {
             el: '#vcomments',
             path: window.location.pathname,

layout/_partial/third_party/comment/waline.ejs

@@ -2,7 +2,7 @@
 <div id="wcomments"></div>
 <script>
 function LoadWaline() {
-    getScript("<%-theme.waline.source%>",function(){
+    mengd.getScript("<%-theme.waline.source%>",function(){
         let initData = {
             el: '#wcomments',
             path: location.pathname,

layout/_partial/third_party/pjax.ejs

@@ -1,6 +1,6 @@
 <!-- <%if(theme.pjax){%> -->
 <script>
-    getScript('<%-theme.CDN.pjax%>', LoadPjax)
+    mengd.getScript('<%-theme.CDN.pjax%>', LoadPjax)
 
     function LoadPjax() {
         window.pjax = new Pjax({
@@ -20,7 +20,7 @@
     // 执行进度条
     function ProgressStart() {
         const className = 'pjax-progress';
-        var dom = $query('.' + className);
+        var dom = mengd.$query('.' + className);
         // 设置初始进度
         var progress = 10;
         // 创建进度条 及 css样式
@@ -52,7 +52,7 @@
     function ProgressFinish() {
         clearInterval(timer);
         // 页面加载完毕后进度100% 并在0.7秒后删除
-        var progress = $query('.pjax-progress')
+        var progress = mengd.$query('.pjax-progress')
         progress.style.width = '100%';
         timer = setTimeout(function () {
             progress.parentNode.removeChild(progress)

scripts/register_pages.js

@@ -46,7 +46,7 @@ hexo.extend.generator.register('artitalk', () => {
   let content = `
         <div id="artitalk_main"></div>
         <script>
-            getScript("${theme.artitalk.source}",function(){
+        mengd.getScript("${theme.artitalk.source}",function(){
                 let initData = {
                     appId: '${theme.artitalk.appid}',
                     appKey: '${theme.artitalk.appkey}',

source/js/lazyload.js

@@ -4,8 +4,7 @@
  * @param {*} attr 图片的真实url地址
  */
 function ImgLazyLoad(img, attr) {
-  var imgLazyLoad = $queryAll(img)
-  function LazyLoad(target) {
+  mengd.$queryAll(img).forEach((target) => {
     const io = new IntersectionObserver((entries, Observer) => {
       entries.forEach((entry) => {
         setTimeout(function () {
@@ -19,7 +18,6 @@ function ImgLazyLoad(img, attr) {
       })
     })
     io.observe(target)
-  }
-  imgLazyLoad.forEach(LazyLoad)
+  })
 }
 ImgLazyLoad('body img[data-img]', 'data-img')

source/js/main.js

@@ -4,15 +4,15 @@ var mobileNav
 
 // table wrap
 function tableWrap() {
-  var table = $queryAll('.post-content>table,.content>table')
+  var table = mengd.$queryAll('.post-content>table,.content>table')
   table.forEach(function (item) {
-    wrap(item, 'div', null, 'table-wrap')
+    mengd.wrap(item, 'div', null, 'table-wrap')
   })
 }
 
 // 打开侧边导航栏
 function openMobile() {
-  var openNav = $query('.open-nav')
+  var openNav = mengd.$query('.open-nav')
   if (!openNav) return
   openNav.onclick = function () {
     var isOpen = mobileNav.classList.contains('open-mobile')
@@ -26,7 +26,7 @@ function openMobile() {
 // 关闭所有正在打开的弹窗(搜索框、侧边栏)
 function closeAll() {
   // 搜索框缩放样式
-  var localSearch = $id('local-search')
+  var localSearch = mengd.$id('local-search')
   if (localSearch) {
     localSearch.classList.remove('search-animation-max')
     localSearch.classList.add('search-animation-min')
@@ -44,10 +44,10 @@ function closeAll() {
 
 // 深色模式
 function DarkMode() {
-  if (!$id('darkmode')) return
+  if (!mengd.$id('darkmode')) return
   var body = document.getElementsByTagName('body')[0]
-  var darkBtn = $id('darkmode')
-  var darkIco = $query('#darkmode i')
+  var darkBtn = mengd.$id('darkmode')
+  var darkIco = mengd.$query('#darkmode i')
 
   if (localStorage.isDark === 'true') {
     html.setAttribute('theme', 'dark')
@@ -82,12 +82,12 @@ function scrollFn() {
   var windowTop = 0 // 定义初始位置
   window.addEventListener(
     'scroll',
-    throttle(function () {
+    mengd.throttle(function () {
       var winHeight = document.documentElement.clientHeight
       var scrollTop = window.scrollY || document.documentElement.scrollTop
 
       // 头部导航栏
-      var navbar = $query('.navbar')
+      var navbar = mengd.$query('.navbar')
       if (scrollTop > windowTop) {
         navbar.style.transform = 'translateY(-60px)'
         windowTop = scrollTop
@@ -97,8 +97,8 @@ function scrollFn() {
       }
 
       // toc目录百分比
-      var article = $query('.post-content')
-      var num = $query('.num')
+      var article = mengd.$query('.post-content')
+      var num = mengd.$query('.num')
       if (article && num) {
         var headerHeight = article.offsetTop
         var docHeight = article.clientHeight
@@ -109,18 +109,18 @@ function scrollFn() {
         var percentage = scrollPercentRounded > 100 ? 100 : scrollPercentRounded <= 0 ? 0 : scrollPercentRounded
 
         num.innerText = percentage + '%'
-        $query('.progress').value = percentage
+        mengd.$query('.progress').value = percentage
       }
     }, 100)
   )
 }
 
 // 只有文章页才会执行
 function articlePage() {
-  if (!$id('post')) return
+  if (!mengd.$id('post')) return
   ;(function () {
     // 代码框
-    var codeBlock = $queryAll('figure.highlight')
+    var codeBlock = mengd.$queryAll('figure.highlight')
     codeBlock.forEach(function (item) {
       var lang = item.classList[1]
       lang = lang == 'plaintext' ? 'code' : lang
@@ -132,8 +132,8 @@ function articlePage() {
   })()
   ;(function () {
     // fancybox
-    getScript($config.CDN.fancyboxJs, function () {
-      const imgAll = $queryAll('.post-content img')
+    mengd.getScript($config.CDN.fancyboxJs, function () {
+      const imgAll = mengd.$queryAll('.post-content img')
       imgAll.forEach((ele) => ele.setAttribute('data-fancybox', ''))
       var link = document.createElement('link')
       link.rel = 'stylesheet'
@@ -145,7 +145,7 @@ function articlePage() {
   ;(function () {
     // 代码块折叠
     if (!$config.codeBlockExpand || !$config.codeBlockExpand.enable) return
-    var CodeBlock = $queryAll('figure.highlight')
+    var CodeBlock = mengd.$queryAll('figure.highlight')
     // 定义高度
     var height = $config.codeBlockExpand.height
     // 获取当前页面的所有的代码块 循环判断符合条件的折叠
@@ -163,7 +163,7 @@ function articlePage() {
       }
     }
     // 展开
-    $queryAll('.show-btn').forEach(function (item) {
+    mengd.$queryAll('.show-btn').forEach(function (item) {
       item.onclick = function () {
         var child = item.childNodes[0] // 获取子节点
         if (child.className == 'fas fa-angle-down') {
@@ -188,8 +188,8 @@ function articlePage() {
   })()
   ;(function () {
     // 打开目录
-    var openToc = $id('open-toc')
-    var toc = $id('toc-wrap')
+    var openToc = mengd.$id('open-toc')
+    var toc = mengd.$id('toc-wrap')
     if (!openToc || !toc) return
     openToc.onclick = function () {
       if (parseInt(toc.style.opacity)) {
@@ -206,7 +206,7 @@ function articlePage() {
   })()
   ;(function () {
     // 代码块复制
-    $queryAll('figure.highlight').forEach(function (item) {
+    mengd.$queryAll('figure.highlight').forEach(function (item) {
       // 获取所有代码块
       // firstChild: 获取代码块中的第一个子元素
       // childNodes: 返回当前元素的所有子元素(包括:before和:after)
@@ -228,13 +228,13 @@ function articlePage() {
 // 执行所有函数
 function exeAllFn() {
   html = document.getElementsByTagName('html')[0]
-  mask = $id('mask')
-  mobileNav = $id('mobile-nav')
+  mask = mengd.$id('mask')
+  mobileNav = mengd.$id('mobile-nav')
   articlePage() // 只有文章页才会执行
   tableWrap() // 添加table外围
   openMobile() // 打开手机端导航栏
   closeAll() // 关闭所有弹窗
   DarkMode() // 深色模式
   scrollFn() // 滚动事件
 }
-window.onload = exeAllFn
+document.addEventListener('DOMContentLoaded', exeAllFn)

source/js/search.js

@@ -1,9 +1,9 @@
 try {
-  var localSearch = $id('local-search')
-  var html = $query('html')
-  var mask = $id('mask')
-  var searchBtn = $query('.search-btn')
-  var searchClose = $query('.search-close-button')
+  var localSearch = mengd.$id('local-search')
+  var html = mengd.$query('html')
+  var mask = mengd.$id('mask')
+  var searchBtn = mengd.$query('.search-btn')
+  var searchClose = mengd.$query('.search-close-button')
   var isLoad = false // 资源是否被加载
   var searchId = 'local-search-input'
   var contentId = 'local-search-result'
@@ -16,7 +16,7 @@ try {
    */
   async function search(path) {
     try {
-      var $resultContent = $id(contentId)
+      var $resultContent = mengd.$id(contentId)
       $resultContent.insertAdjacentHTML('beforeBegin', '<i class="fas fa-spinner fa-pulse" style="display:flex;justify-content:center"></i>')
 
       const suffix = path.split('.')[1]
@@ -39,11 +39,11 @@ try {
 
       if (datas.length) isLoad = true
       // 删掉加载动画
-      const pulse = $query('i.fa-pulse')
+      const pulse = mengd.$query('i.fa-pulse')
       pulse.parentElement.removeChild(pulse)
 
       // 获取搜索输入框
-      var $input = $id(searchId)
+      var $input = mengd.$id(searchId)
       // 获取到信息后调用一次
       onInput()
       $input.addEventListener('input', onInput)
@@ -124,7 +124,7 @@ try {
       html.style.overflow = 'hidden'
       localSearch.classList.remove('search-animation-min')
       localSearch.classList.add('search-animation-max')
-      $id(searchId).focus()
+      mengd.$id(searchId).focus()
     }
   }