在学习过程中，我们经常会遇到大量的在线课程需要完成。这些课程有些需要手动点击才能完成，而有些则需要等待视频播放完毕后才能自动跳转到下一节课程。因此，我决定编写一个半自动化的学习脚本来提高学习效率。
思路：
- 首先，在用户脚本元数据部分，我定义了脚本的名称、版本号、描述等信息。
- 接着，在页面加载完成后的回调函数中，我创建了一个日志面板，并将其添加到页面上。这个日志面板用于输出日志信息。
- 然后，我使用querySelector查找了页面上的”.stu_intro”元素，如果找到了这个元素，就获取其中的所有<li>元素。
- 对于每个<li>元素，我通过querySelector获取其中的<a>元素和<li>元素，并分别获取课程名称和状态信息。然后，我将课程名称和状态信息输出到日志面板中。
- 如果状态为未完成，我就通过click()方法点击<a>元素，并将点击的链接地址输出到日志面板中。
- 接着，我使用querySelectorAll获取页面上所有以”javascript:ShowCourseware”开头的<a>元素。
- 对于每个<a>元素，我通过getAttribute方法获取其href属性值，然后判断状态是否为”已完成”。如果不是，则通过click()方法点击<a>元素，并将点击的链接地址输出到日志面板中。
- 然后，我使用querySelectorAll获取页面上所有带有”bg1″或”bg2″类名的元素，并通过filter方法筛选出状态为”未开始”或”未学完”的项目。
- 对于筛选出的每个项目，我通过querySelector获取其中的<a>元素，并通过click()方法点击<a>元素，并将点击的链接地址输出到日志面板中。
- 接着，我使用setInterval定时检查页面上是否有弹窗，并自动点击弹窗中的”是”按钮。每隔10秒钟检查一次，如果有弹窗，则通过querySelector和click()方法进行处理，并将点击的时间和信息输出到日志面板中。
- 最后，我定义了一个名为checkVideoStatus的函数，用于检查视频播放状态。在函数中，我通过querySelector获取视频播放时间的显示区域，并判断当前时间是否等于总时间。如果相等，表示视频已经播放完毕，将页面重定向到指定链接；否则，表示视频还未播放完毕，输出相应的日志信息。
- 最后，我使用setInterval设置定时器，每隔10秒钟调用一次checkVideoStatus函数，用于循环检查视频播放状态。
总结： 通过编写这个半自动化的学习脚本，可以更加高效地完成在线课程的学习。在这个过程中，我主要使用了JavaScript和DOM操作，通过不同的条件来点击页面上的链接，并输出相应的日志信息。同时，我也加入了定时器，实现了一些自动化的操作，例如检查弹窗、检查视频播放状态等。这样不仅可以提高学习效率，同时也是我对JavaScript和DOM操作的一个练习和探索。
// ==UserScript==
// @name 学习
// @namespace https://rensr.site
// @version 2024-01-22
// @description 半自动学习
// @author 任尚仁
// @match https://学习地址
// @icon https://web.rensr.site/assets/img/web-logo.png
// @grant none
// ==/UserScript==
(function() {
'use strict';
// 创建日志面板
const logPanel = document.createElement('div');
logPanel.style.position = 'fixed';
logPanel.style.top = '0';
logPanel.style.right = '0';
logPanel.style.width = '300px';
logPanel.style.height = '50%';
logPanel.style.backgroundColor = 'white';
logPanel.style.overflow = 'auto';
document.body.appendChild(logPanel);
// 日志输出函数
function log(message) {
const logMessage = document.createElement('p');
logMessage.textContent = message;
logPanel.appendChild(logMessage);
// 滑动滚动条，显示最新消息
logPanel.scrollTop = logPanel.scrollHeight;
}
// 等待页面加载完成
window.addEventListener('load', () => {
// 查找 stu_intro div
var stuIntroDiv = document.querySelector('.stu_intro');
if (stuIntroDiv) {
// 在 stu_intro div 获取全部的<li>元素
var liElements = stuIntroDiv.getElementsByTagName('li');
// 点击状态为未完成的<li>元素
for (var i = 0; i < liElements.length; i++) {
var linkElement = liElements[i].querySelector('a');
var statusElement = liElements[i].querySelector('i');
var courseName = linkElement.textContent;
var courseStatus = statusElement.innerText;
// 输出课程和状态
log('课程：' + courseName);
log('状态：' + courseStatus);
if (linkElement && statusElement && statusElement.innerText === '[未完成]') {
linkElement.click();
log('点击了链接：' + href);
}
}
}
// 获取所有的<a>元素
const linkElements = document.querySelectorAll('a[href^="javascript:ShowCourseware"]');
// 遍历每个<a>元素
linkElements.forEach((linkElement) => {
const statusText = linkElement.getAttribute('href')
.match(/'([^']+)'/)[1];
if (statusText !== '已完成') {
// 点击链接
linkElement.click();
log('点击了链接：' + linkElement.getAttribute('href'));
}
});
// 获取所有未开始的项目
const rows = document.querySelectorAll('tr.bg1, tr.bg2');
const unfinishedItems = Array.from(rows)
.filter(row => {
const status = row.querySelector('td:nth-child(3) span')
.textContent.trim();
return status === '未开始' || status === '未学完';
});
// 点击未开始的项目
unfinishedItems.forEach(item => {
const link = item.querySelector('a');
if (link) {
link.click();
log('点击了链接：' + link.getAttribute('href'));
}
});
// 检查弹窗并自动点击“是”
setInterval(function() {
const popup = document.querySelector('.school-sate');
if (popup) {
const yesButton = popup.querySelector('button:nth-of-type(1)');
if (yesButton) {
yesButton.click();
log('[' + new Date()
.toLocaleString() + '] ' + '点击了‘是’按钮');
}
}
log('[' + new Date()
.toLocaleString() + '] ' + '正在检查在线弹窗...');
}, 10000);
// 检查视频播放状态
function checkVideoStatus() {
const timeDisplay = document.querySelector('.prism-time-display');
if (timeDisplay) {
const currentTime = timeDisplay.querySelector('.current-time')
.textContent;
const duration = timeDisplay.querySelector('.duration')
.textContent;
log(`当前时间: ${currentTime} / 总时间: ${duration}`);
if (currentTime === duration) {
log('视频已经播放完毕');
window.location.href = '跳转到学习首页';
} else {
log('视频还未播放完毕');
}
}
}
setInterval(checkVideoStatus, 10000); // 每10秒钟执行一次判断
});
})();
