互联网做什么行业前景好,seo常用方法,济南市网站建设企业,怎样学网站开发概述
浏览网页的时候#xff0c;可能需要去数一下某段文字的字符数量#xff0c;或者需要对选中内容做些实时翻译#xff0c;比如进制的转化#xff0c;可以使用脚本做个简单的实时翻译。
效果
选中内容#xff0c;并且鼠标移动时会在左下角显示翻译后的结果。示例为翻…概述
浏览网页的时候可能需要去数一下某段文字的字符数量或者需要对选中内容做些实时翻译比如进制的转化可以使用脚本做个简单的实时翻译。
效果
选中内容并且鼠标移动时会在左下角显示翻译后的结果。示例为翻译二进制为十进值
使用方式
打开开发者工具复制以下方法到控制台执行方法如果需要自定义处理结果则第一个参数不为空
/*** 显示页面选中字符的长度,可修改处理结果* param simple 是否使用简单的事件处理逻辑*/
function getSelectionText(simple true, render) {//监听范围为当下documentlet el document.body;//添加显示元素let el_num document.getElementById(selectionNum);if (!el_num) {el_num document.createElement(div);el_num.setAttribute(id, selectionNum);el_num.style position: fixed;left: 0px;bottom: 0px;width: 100px;height: 20px;line-height: 20px;border: 1px solid rgb(0, 0, 0);background: rgb(255, 255, 255);;el.appendChild(el_num)}let text;let paint () {//自行修改输出的内容text document.getSelection().toString();el_num.innerHTML typeof render function? render(text):text.length;};let shower window.shower || {};//移除上次添加的事件el.removeEventListener(mousedown, shower.mouseDownHandle);el.removeEventListener(mousemove, shower.mouseMoveHandle);el.removeEventListener(mouseup, shower.mouseUpHandle);//简单逻辑只使用mousemove 否则使用 mousedown mouseup mousemoveif (simple) {shower.mouseMoveHandle () paint();} else {shower.readyShow false;shower.mouseMoveHandle () shower.readyShow paint();shower.mouseDownHandle () {shower.readyShow true;el.addEventListener(mouseup, shower.mouseUpHandle);el.addEventListener(mousemove, shower.mouseMoveHandle);};shower.mouseUpHandle () {shower.readyShow false;el.removeEventListener(mousemove, shower.mouseMoveHandle);el.removeEventListener(mouseup, shower.mouseUpHandle);};}window.shower shower;el.addEventListener(mousemove, shower.mouseMoveHandle);el.addEventListener(mousedown, shower.mouseDownHandle)
}
