2048核基地列表显示预览图

2048核基地列表显示预览图，只对 bbs.klnkn.com 域名有效

// ==UserScript==
// @name         2048核基地列表显示预览图
// @namespace    http://tampermonkey.net/
// @version      0.0.1
// @description   2048核基地列表显示预览图，只对 bbs.klnkn.com 域名有效
// @author       meteora
// @match        https://bbs.klnkn.com/2048/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=klnkn.com
// @grant        none
// @license MIT
// ==/UserScript==

;(() => {
	const domList = document.querySelectorAll(
		"#ajaxtable > tbody:nth-child(2) > tr"
	)
	if (!domList) return
	for (const item of domList) {
		//获取元素里面的预览图片的地址
		const aDom = item.querySelector("td:nth-child(2) > a")
		if (!aDom) continue // 防止页面没有链接
		const pageUrl = aDom.href
		if (!pageUrl) continue // 防止页面没有链接
		fetch(pageUrl).then(async (res) => {
			let appendDom = ""
			const responseText = await res.text()
			//通过响应的网页代码构造出一颗dom树以选取里面的元素，以元素里面的图片地址
			const dom = document.createElement("div")
			dom.innerHTML = responseText
			const imgDomList = dom.querySelectorAll(
				"img.preview-img"
			)
			if (!imgDomList || imgDomList.length === 0) return
			//只取前面2张
			for (let i = 0; i < 2; i++) {
				if (!imgDomList[i]) break // 防止数组越界
				const imgDomListElement = imgDomList[i];
				const imageSrc = imgDomListElement.getAttribute("src");
				appendDom += `<img src="${imageSrc}" style="height: auto; max-height: 250px; display: inline-block; margin-right: 5px" alt="" loading="lazy"/>`;
			}
			//在下面插入一个元素
			const newElement = document.createElement("tr")
			const newElementInside = document.createElement("td")
			newElementInside.setAttribute("colspan", "5")
			newElementInside.innerHTML = appendDom
			newElement.appendChild(newElementInside)
			item.insertAdjacentElement("afterend", newElement)
		})
	}
})()