Highlights clickable elements on web pages.
Per
// ==UserScript==
// @name Clickable Elements Highlighter
// @namespace http://your-namespace-here
// @version 1.0.2
// @description Highlights clickable elements on web pages.
// @match http*://*/*
// ==/UserScript==
(function() {
const clickableElements = document.querySelectorAll("a, button, input, select, textarea, [role=button], [role=link], [role=checkbox], [role=radio], [role=menuitem], [contenteditable=true]");
clickableElements.forEach(element => {
element.addEventListener("click", function(event) {
this.style.border = "";
event.stopPropagation();
});
element.addEventListener("mousedown", function(event) {
if (event.which === 2) {
this.style.border = "";
event.stopPropagation();
}
});
element.style.border = "1px solid red";
});
document.addEventListener("click", function() {
clickableElements.forEach(element => {
element.style.border = "1px solid red";
});
});
// Call function to mark clickable elements in other JavaScript files
markClickableElementsInOtherFiles();
function markClickableElementsInOtherFiles() {
const scriptTags = document.querySelectorAll('script[src]'); // 获取页面中所有的<script>标签
scriptTags.forEach(script => {
const file = script.getAttribute('src'); // 获取<script>标签的src属性值
if (file.endsWith('.js')) { // 确保文件以.js结尾且不是主文件main.js
fetch(file)
.then(response => response.text())
.then(code => {
const dummyDiv = document.createElement('div');
dummyDiv.innerHTML = code;
const clickableElementsInFile = dummyDiv.querySelectorAll("a, button, input, select, textarea, [role=button], [role=link], [role=checkbox], [role=radio], [role=menuitem], [contenteditable=true],span");
clickableElementsInFile.forEach(element => {
element.style.border = "1px solid red";
});
})
.catch(error => {
console.error(`Error fetching or parsing ${file}:`, error);
});
}
});
}
})();