浏览器中js外挂脚本的执行方式

1、开发工具控制台交互执行

网页中按F12打开开发者工具,选择"控制台",键入js脚本命令回车执行,适用于临时使用脚本逻辑简单的场景,实例如下:

javascript 复制代码
// 获取网页元素的文本脚本
var elem = document.getElementById("elem_id"); 
var elem_text = copyText.innerText; 
elem_text

以获取该网页https://www.52pojie.cn/thread-1941978-1-1.html标题文本为例,具体操作如下:

首先获取元素id,如当前帖子标题id为thread_suject

然后根据元素id,编写js脚本命令获取元素文本,如下图所示标题文本获取成功

2、开发工具中编写js代码文件片段执行

网页中按F12打开开发者工具,选择"源代码"->"片段"->"新片段",键入js脚本代码,点击运行按钮执行,适用于脚本逻辑复杂的场景,实例如下:

点击运行后,切换至控制台,可发现标题文本已经获得

3、建立网页收藏夹执行

打开浏览器收藏夹管理器,新建收藏夹,添加名称为"获取帖子主题元素文本",并将URL中键入上述脚本(PS:脚本前需要加上"javascript:"前缀说明脚本是js脚本,否则脚本无法解析执行),如下图所示:

javascript 复制代码
javascript:var elem = document.getElementById("thread_subject"); var elem_text = elem.innerText; elem_text;

添加完收藏夹后,切换至帖子页面,点击收藏夹执行脚本

执行结果如下图所示:

相关推荐
FQNmxDG4S7 小时前
Java多线程编程:Thread与Runnable的并发控制
java·开发语言
ZC跨境爬虫7 小时前
跟着 MDN 学 HTML day_9:(信件语义标记)
前端·css·笔记·ui·html
前端老石人7 小时前
HTML 字符引用完全指南
开发语言·前端·html
matlab_xiaowang7 小时前
Redux 入门:JavaScript 可预测状态管理库
开发语言·javascript·其他·ecmascript
幼儿园技术家7 小时前
前端如何设计权限系统(RBAC / ABAC)?
前端
虹科网络安全7 小时前
艾体宝干货|数据复制详解:类型、原理与适用场景
java·开发语言·数据库
axng pmje8 小时前
Java语法进阶
java·开发语言·jvm
老前端的功夫8 小时前
【Java从入门到入土】28:Stream API:告别for循环的新时代
java·开发语言·python
qq_435287928 小时前
第9章 夸父逐日与后羿射日:死循环与进程终止?十个太阳同时值班的并行冲突
java·开发语言·git·死循环·进程终止·并行冲突·夸父逐日
止语Lab8 小时前
从手动到框架:Go DI 演进的三个拐点
开发语言·后端·golang