开发浏览器扩展程序（js脚本）

一、打开谷歌浏览器扩展程序

二、 打开 开发者模式

三、 加载已解压的扩展程序

四、选择编写好的脚本文件夹

看不到文件，没关系，默认会加载 manifest.json 文件

实际文件夹内容

五、 加载成功

 六、开始编辑脚本文件

①、name：扩展名字

②、description：扩展描述

③、default_icon：扩展icon图标

④、matches：执行脚本的网址，* 代表通配符

⑤、js：加载运行的 js 文件

{
  "name": "vpy",
  "manifest_version": 2,
  "version": "1.0",
  "description": "自动播放",
  "browser_action": {
    "default_icon": "1.png"
  },
  "permissions": ["tabs", "http://*/*", "https://*/*"],
  "content_scripts": [
    {
      "matches": ["http://网址/view.php?*"],
      "js": ["vpy.js"]
    }
  ]
}

七、vpy.js

// 封装暂停函数（一次性）
function suspend(time) {
  return new Promise((resolve) => {
    console.log('等待' + time / 1000 + '秒')
    setTimeout(() => {
      resolve('等待结束')
    }, time)
  })
}

window.onload = async () => {
  // 等待3秒
  console.log(await suspend(3000))

  // 获取所有专题
  var allSpecial = Array.from(document.getElementsByClassName('listinfo')[0].children)

  // 获取当前专题的标题前3个字符
  var nowTitle = document.getElementsByClassName('hidden-sm-down')[0].children[0].innerText.slice(0, 3)

  // 获取所有课程
  var allCoures = Array.from(document.getElementsByClassName('mlist')[0].children[0].children)

  // 获取视频按钮
  const videoBtn = document.getElementsByTagName('canvas')[0]

  // 判断是否有视频
  if (videoBtn) {
    videoBtn.click()
  } else {
    // 遍历所有课程
    allCoures.forEach((item, index) => {
      // 找到当前课程
      if (item.className == 'act') {
        // 判断是否最后一个课程
        if (index == allCoures.length - 1) {
          // 遍历所有专题
          allSpecial.forEach((item1, index1) => {
            // 找到当前专题
            if (item1.innerText.slice(0, 3) == nowTitle) {
              // 判断是否最后一个专题
              if (index1 == allSpecial.length - 1) {
                alert('完成毕业！')
              } else {
                // 点击下一个专题
                allSpecial[index1 + 1].click()
              }
            }
          })
        } else {
          // 点击下一个课程
          allCoures[index + 1].click()
        }
      }
    })
  }
}

注：个人理解就是浏览器执行 js 代码，只是经过 manifest.json 文件来引入；

先到此，后面再学习补充！

end