javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > 网页复制自由编辑显示星号

超级标签之一键解除网页复制限制、网页自由编辑、显示星号密码功能代码

投稿:mdxy-dxy

实现以上功能不用安装任何插件,把下列书签图标拖动到浏览器书签栏,就可以实现一键解除网页复制限制、网页自由编辑、显示星号密码功能

下面为了方便大家直接使用直接将链接拖动到浏览器书签栏即可

🔑 显示星号密码

拖动图标添加到书签栏,点击 显示星号密码 书签后,即可当前网页的星号密码,适用于绝大部分网站。

核心代码

javascript:"use strict";!function(){for(var t=document.getElementsByTagName("input"),e=0;e<t.length;e++)"password"===t[e].getAttribute("type")&&t[e].setAttribute("type","text")}();

显示星号密码

把上面的链接拖动到浏览器书签栏试试

如果部分网站仍然无法显示星号密码,可以使用增强型扩展 (opens new window)。支持QQ,百度,阿里等更多网站。

代码解释

这段代码是一个简单的 JavaScript 脚本,用于将页面中所有类型为 password 的输入框(<input> 标签)的类型改为 text,从而使输入的密码以明文形式显示出来。以下是代码的逐步解析:

代码内容:

"use strict"; 
!function(){
    for(var t=document.getElementsByTagName("input"), e=0; e<t.length; e++)
        "password"===t[e].getAttribute("type") && t[e].setAttribute("type", "text")
}();

代码解析:

"use strict";

开启严格模式(strict mode),以防止某些不安全或不被推荐的 JavaScript 用法。例如,它会阻止使用未声明的变量。

严格模式可以帮助提高代码的安全性和可靠性。

!function(){ ... }();

这是一个立即执行函数表达式(IIFE,Immediately Invoked Function Expression)

通过加 !(或其他符号,如 ())使函数成为表达式,并立即执行它的内容。

这个函数的主要作用是防止变量污染全局作用域。

document.getElementsByTagName("input")

使用 document.getElementsByTagName 获取页面中所有的 <input> 元素,返回一个 HTML 集合(HTMLCollection)。

for(var t=document.getElementsByTagName("input"), e=0; e<t.length; e++)

定义了一个循环,变量 t 是存储所有 input 元素的集合。

变量 e 是循环计数器,从 0 开始,直到遍历所有的 input 元素。

t[e].getAttribute("type")

对每个 <input> 元素,检查它的 type 属性值。

如果 type 属性等于 "password",则继续执行后面的逻辑。

t[e].setAttribute("type", "text")

将满足条件的 <input> 元素的 type 属性从 "password" 改为 "text"

这样,密码输入框就会从掩码(隐藏字符,例如 ****)变为明文显示。

运行结果

代码执行后,页面上所有的密码输入框将变为明文显示。

实际用途:

🔓解除网页限制

拖动图标添加到书签栏,点击 解除网页限制 书签后,即可解锁当前网站的复制限制右键限制选择限制等,适用于绝大部分网站。

核心代码

javascript:"use strict";!function(){var t=function(t){t.stopPropagation(),t.stopImmediatePropagation&&t.stopImmediatePropagation()};["copy","cut","contextmenu","selectstart","mousedown","mouseup","keydown","keypress","keyup"].forEach(function(e){document.documentElement.addEventListener(e,t,{capture:!0})}),alert("解除限制成功啦!")}();

解除网页限制

把上面的链接拖动到浏览器书签栏试试

代码解释

这段代码是一个用于解除网页上的一些用户交互限制的 JavaScript 脚本,通常被用于解决一些网站限制用户操作的情况,比如禁用复制、右键菜单或选择文本等。下面是对代码的详细解释:

这段代码的主要功能是通过监听并阻止特定事件的传播,来解除一些网页上的交互限制。例如:

通过阻止这些事件的传播,用户可以重新获得对网页的控制权。

 代码逐步解析

(1) "use strict";

开启严格模式,使代码更加规范,避免一些隐含错误。

(2) !function(){ ... }();

这是一个自执行函数(IIFE,Immediately Invoked Function Expression),用于封装代码,避免污染全局作用域。

(3) var t = function(t){ ... };

定义了一个事件处理函数 t,用于阻止事件的传播:

t.stopPropagation():阻止事件冒泡到父级元素。

t.stopImmediatePropagation && t.stopImmediatePropagation():如果存在 stopImmediatePropagation 方法(某些浏览器支持),则阻止事件的后续处理器被调用。

(4) ["copy", "cut", ...].forEach(function(e){ ... });

列出了一组事件类型,包括:

对这些事件进行遍历,并为每个事件类型添加一个全局监听器。

剪切和复制相关的事件:copy、cut

右键菜单事件:contextmenu

文本选择事件:selectstart

鼠标事件:mousedown、mouseup

键盘事件:keydown、keypress、keyup

(5) document.documentElement.addEventListener(e, t, {capture: !0});

为 document.documentElement(HTML 根节点)添加事件监听器:

e 是当前事件类型,比如 copy 或 mousedown。

t 是之前定义的事件处理函数,用于阻止事件的传播。

{capture: !0} 表示

✍️ 网页自由编辑

拖动图标添加到书签栏,点击 网页自由编辑 书签后,当前网页内容变为可以编辑的状态,再次点击退出编辑状态,适用于所有网站。

核心代码

javascript:"use strict";!function(){"true"===document.body.getAttribute("contenteditable")?(document.body.setAttribute("contenteditable",!1),alert("网页不能编辑啦!")):(document.body.setAttribute("contenteditable",!0),alert("网页可以编辑啦!"))}();

网页自由编辑

把上面链接拖动到浏览器书签栏试试

代码解释

这段代码是一段 JavaScript 书签代码(bookmarklet),用于切换网页的内容是否可编辑(contenteditable 属性),以下是代码的详细解释:

"use strict"; 
!function(){
    "true" === document.body.getAttribute("contenteditable")
    ? (
        document.body.setAttribute("contenteditable", !1), 
        alert("网页不能编辑啦!")
    ) 
    : (
        document.body.setAttribute("contenteditable", !0), 
        alert("网页可以编辑啦!")
    )
}();

功能简介

这段代码通过设置网页 <body> 元素的 contenteditable 属性,使网页内容变为可编辑或不可编辑状态。执行后会弹出一个提示框,告知当前状态是否可编辑。

详细拆解:

启用严格模式:

"use strict";

启用严格模式,目的是提高代码的安全性,防止一些潜在的错误。

自调用匿名函数:

!function() { ... }();

这是一个立即执行函数表达式(IIFE,Immediately Invoked Function Expression)。该函数会在代码运行时立即执行。

获取 contenteditable 属性值:

"true" === document.body.getAttribute("contenteditable")

检查 <body> 元素的 contenteditable 属性值是否为 "true":

如果 contenteditable="true",说明当前网页内容是可编辑的。

如果没有设置,或值为 false,说明网页内容不可编辑。

切换状态:

document.body.setAttribute("contenteditable", !1)

如果当前是 "true",将 contenteditable 属性设置为 false,使网页不可编辑。

如果当前不是 "true"(即不可编辑),则将其设置为 true,使网页可编辑。

弹窗提示:

alert("网页不能编辑啦!");

根据当前状态,通过 alert 弹出提示框:

如果 contenteditable 被设置为 false,弹出“网页不能编辑啦!”。

如果设置为 true,弹出“网页可以编辑啦!”。

使用场景:

调试或快速修改网页: 这段代码可以临时让网页内容变为可编辑状态,用于前端调试或快速修改页面上的内容。

简单演示或教学: 可以用来演示网页中 contenteditable 属性的效果。

如何运行:

将整个代码复制到浏览器地址栏或书签中。

在任意网页上点击执行代码即可切换网页的编辑状态。

总结:

这段代码的核心功能是利用 HTML 的 contenteditable 属性,让用户可以通过点击执行代码,在网页内容“可编辑”和“不可编辑”之间切换,同时通过弹窗提示用户当前的状态。

到此这篇关于超级标签之一键解除网页复制限制、网页自由编辑、显示星号密码功能代码的文章就介绍到这了,更多相关网页复制自由编辑显示星号内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

阅读全文