📝 分享个实用小函数（书签）：鼠标选择提取网页文本

[Qiner (林黛玉倒拔垂杨柳)]

(\ _ /)
( ･-･)
/っ   就刚才的工作使用场景，觉得还挺实用。

↑ 简而言之我想把整个列表投喂给 AI 让帮起名，虽然栏目都是文本但不好拖拽点中即跳转、滚动截屏也能但稍微麻烦点而且 OCR 处理奇怪颜文字那些也容易有误差。

所以点一下这个书签，会进入鼠标选择状态：

 

光标置于不同 DOM 会实时显示范围，所见范围就是整个 DOM（包括不可见的 Scrollbar 下面）的文本捕获。

左键点击后就可以复制到剪贴板：

(\ _ /)
( ･-･)
/っ   就是这样。源码 ↓

javascript半角冒号(function(){let removeDuplicates=true;let selectedElement=null;let overlay=null;function createOverlay(){overlay=document.createElement('div');overlay.style.cssText='position:fixed;top:0;left:0;width:100%;height:100%;z-index:999999;pointer-events:none;';document.body.appendChild(overlay)}function highlightElement(element){if(!element)return;const rect=element.getBoundingClientRect();overlay.style.cssText+=`border:2px solid red;background:rgba(255,0,0,0.1);top:${rect.top+window.scrollY}px;left:${rect.left+window.scrollX}px;width:${rect.width}px;height:${rect.height}px;position:absolute;pointer-events:none;z-index:999999;`}function getTextNodes(element){let textNodes=removeDuplicates?new Set():[];let walker=document.createTreeWalker(element,NodeFilter.SHOW_TEXT,null,false);let node;while(node=walker.nextNode()){if(node.textContent.trim()){if(removeDuplicates){textNodes.add(node.textContent.trim())}else{textNodes.push(node.textContent.trim())}}}return removeDuplicates?Array.from(textNodes):textNodes}function copyToClipboard(text){const textarea=document.createElement(%27textarea%27);textarea.value=text;document.body.appendChild(textarea);textarea.select();document.execCommand(%27copy%27);document.body.removeChild(textarea)}function handleClick(e){e.preventDefault();e.stopPropagation();selectedElement=e.target;const textNodes=getTextNodes(selectedElement);const content=textNodes.join(%27\n%27);copyToClipboard(content);if(overlay)overlay.remove();document.removeEventListener(%27click%27,handleClick,true);document.removeEventListener(%27mouseover%27,handleMouseOver,true);alert(%27Text content copied to clipboard!%27)}function handleMouseOver(e){highlightElement(e.target)}createOverlay();document.addEventListener(%27click%27,handleClick,true);document.addEventListener(%27mouseover%27,handleMouseOver,true);})();

↑ 手动把半角冒号改回 : 因为直接写发帖会 403。

存 Chrome 书签，需要用的时候点一下就行，书签名随意

函数开头的 removeDuplicates 是去重开关，因为 HTML 列表结构经常有不可见的那些重复声明。不需要去重的话把这个参数值改为 false 即可。

[handsome (大帅哥)]

你也太强了！

[zsfxs (李老八)]

确实好用

[pluto233]

感谢分享喵~

[howecc]

谢谢分享

[supersonic_ai (超音速)]

谢谢大佬 分享

[illiteracy (zx)]

我之前都是开发者模式用鼠标去找。。。。

[Qiner (林黛玉倒拔垂杨柳)]

F12 检查元素要清理标签 当然连标签也一起投喂也不是不行就是臃肿点

[Nomad]

好用, 第一次知道可以添加脚本到书签里面, 感谢佬友

[Cheyne]

更新js书签功能：

1. 保留排版结构位置
2. 把文本超链接的内容，以markdown的格式附在该粘贴文本后面。

javascript替换为冒号void function(){const e="  ";let t=null,o=null;function n(l,d){let s="";if(l.nodeType===Node.ELEMENT_NODE){const a=window.getComputedStyle(l);if("none"===a.display||"hidden"===a.visibility)return"";if(["SCRIPT","STYLE","NOSCRIPT"].includes(l.tagName.toUpperCase()))return""}if(l.nodeType===Node.TEXT_NODE){const r=l.textContent.trim();return r?r:""}let i="";l.childNodes&&l.childNodes.length>0&&l.childNodes.forEach(a=>{i+=n(a,d+1)});const c=l.tagName?l.tagName.toUpperCase():"";return"A"===c&&l.href?s+=`[${i.trim()}](${l.href})`:function(e){if(!e||e.nodeType!==Node.ELEMENT_NODE)return!1;const t=window.getComputedStyle(e).display;return["block","flex","grid","list-item","table"].includes(t)}(l)&&i.trim()?s+="\n"+e.repeat(d)+i.trim()+"\n":"LI"===c?s+="\n"+e.repeat(d)+"- "+i.trim():s+=i,s.replace(/\n\s*\n/g,"\n")}function l(){(t=document.createElement("div")).style.cssText="position:absolute;box-sizing:border-box;border:2px solid #007bff;background:rgba(0,123,255,.1);z-index:999999;pointer-events:none;transition:all .1s ease-in-out",(o=document.createElement("div")).style.cssText="position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background-color:#333;color:white;padding:10px 20px;border-radius:5px;z-index:1000000;font-family:sans-serif;font-size:14px",o.textContent="移动鼠标选择元素，单击复制，按 ESC 取消",document.body.appendChild(t),document.body.appendChild(o)}function d(){t&&t.remove(),o&&o.remove(),document.removeEventListener("click",i,!0),document.removeEventListener("mouseover",s,!0),document.removeEventListener("keydown",a,!0)}function s(e){(function(e){if(!e||!t)return;const o=e.getBoundingClientRect();t.style.top=`${o.top+window.scrollY}px`,t.style.left=`${o.left+window.scrollX}px`,t.style.width=`${o.width}px`,t.style.height=`${o.height}px`})(e.target)}function i(e){e.preventDefault(),e.stopPropagation();const l=e.target,a=n(l,0).trim();a?navigator.clipboard.writeText(a).then(()=>{t&&(t.style.display="none"),o.textContent="✅ 已复制到剪贴板！",setTimeout(d,1200)}).catch(e=>{o.textContent=`❌ 复制失败: ${e}`,setTimeout(d,2e3)}):(o.textContent="❌ 未找到可复制的文本内容。",setTimeout(d,2e3))}function a(e){"Escape"===e.key&&d()}l(),document.addEventListener("click",i,!0),document.addEventListener("mouseover",s,!0),document.addEventListener("keydown",a,!0)}();

使用仍然把“替换为冒号”改为:

[ccy]

这个优化好看一些

[ccy]

禁止复制的页面上也能用，赞

[RONG]

很强，已经用上了

[showyoubetter (且笑风尘不敢造次)]

好用 谢谢大佬分享

[Thenextsupersun (Mike white)]

谢谢分享

[sar60677 (sar)]

感谢分享，佬太强了