使用Chrome 开发者工具提取对应的字符串
最近在查看一个API的数据,效果很好,但是里面只有一部分我想要的内容
如果是简单一点的可以直接获取
如下比如我想要提取返回的代码中关键的字符串:"video": "这里的内容"
// 定义一个正则表达式来匹配 '"video": "链接"' 格式的字符串
var regex = /"video":\s*"([^"]+)"/gi;
// 用于存储所有找到的链接
var links = [];
// 执行正则表达式搜索
var match;
while ((match = regex.exec(document.body.textContent)) !== null) {
// match[1] 包含链接
links.push(match[1]);
}
// 打印所有找到的链接,每个链接一行
links.forEach(function(link, index) {
console.log('video' + (index + 1) + ': ' + link);
});
但是如果返回的结果有10万行代码左右阁下该如何应对?
我突发奇想,让浏览器自己滚动,一边滚动一边扫描就想PLC一样,一边扫描一边执行程序
// 定义一个正则表达式来匹配 '"video": "链接"' 格式的字符串
var regex = /"video":\s*"([^"]+)"/g;
var matches = [];
var interval;
var step = 100; // 每次滚动的像素数
var position = 0; // 当前滚动位置
// 滚动函数
function scrollToBottom() {
position += step;
window.scrollTo(0, position);
// 检查是否到达页面底部
if (position >= document.body.scrollHeight) {
clearInterval(interval);
printMatches();
} else {
// 继续寻找匹配项
findMatches();
}
}
// 查找匹配项的函数
function findMatches() {
var text = document.body.innerText;
var match;
while ((match = regex.exec(text)) !== null) {
matches.push(match[1]); // 只添加链接部分
}
}
// 打印匹配结果的函数
function printMatches() {
console.log('找到的链接数量:', matches.length);
matches.forEach(function(link, index) {
console.log('video' + (index + 1) + ': ' + link);
});
}
// 开始滚动和查找匹配项
interval = setInterval(scrollToBottom, 50); // 每50毫秒滚动一次
讲解:首先定义了一个滚动函数
scrollToBottom,它会逐步向下滚动页面,并在每次滚动后调用findMatches函数来查找匹配的链接。当滚动到页面底部时,通过clearInterval停止滚动,并调用printMatches函数来打印所有找到的链接。
使用Chrome 开发者工具提取对应的字符串的更多相关文章
- Chrome开发者工具不完全指南(六、插件篇)
本篇是Chrome开发者工具的结尾篇,最后为大家介绍几款功能强大的插件.在chrome商店里面有很多插件,没事建议大家去逛逛.不过需要FQ,所以诸位请自备神器.一.皮肤插件 首先是大家期盼已久,翘首以 ...
- Chrome开发者工具详解(4)-Profiles面板
Chrome开发者工具详解(4)-Profiles面板 如果上篇中的Timeline面板所提供的信息不能满足你的要求,你可以使用Profiles面板,利用这个面板你可以追踪网页程序的内存泄漏问题,进一 ...
- Chrome开发者工具详解(1)-Elements、Console、Sources面板
Chrome开发者工具详解(1)-Elements.Console.Sources面板 Chrome开发者工具面板 面板上包含了Elements面板.Console面板.Sources面板.Netwo ...
- Chrome开发者工具详解(1)
Chrome开发者工具面板 面板上包含了Elements.Console.Sources.Network.Timeline.Profiles.Application.Security.Audits这些 ...
- 前端调试效率低?试试这10个“Chrome开发者工具”使用技巧
摘要:今天给大家分享一些使用“Chrome开发者工具”的小技巧.包括调试,优化页面渲染速度等.希望能提升Web开发人员的工作效率. 今天给大家分享一些使用“Chrome开发者工具”的小技巧.包括调试, ...
- Chrome开发者工具详解(1):Elements、Console、Sources面板
Chrome开发者工具面板 面板上包含了Elements面板.Console面板.Sources面板.Network面板. Timeline面板.Profiles面板.Application面板.Se ...
- 用Chrome开发者工具做JavaScript性能分析
来源: http://blog.jobbole.com/31178/ 你的网站正常运转.现在我们来让它运转的更快.网站的性能由页面载入速度和代码执行效率决定.一些服务可以让你的网站载入更快,比如压缩J ...
- 前端开发必备之Chrome开发者工具(一)
本文介绍的 Chrome 开发者工具基于 Chrome 65版本,如果你的 Chrome 开发者工具没有下文提到的那些内容,请检查下 Chrome 的版本 简介 Chrome 开发者工具是一套内置于 ...
- 使用chrome开发者工具中的network面板测量网站网络性能
前面的话 Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具,可用来对网站进行迭代.调试和分析.使用 Network 面板测量网站网络性能.本文将详细介绍chrom ...
- 前端开发必备之Chrome开发者工具(上篇)
本文介绍的 Chrome 开发者工具基于 Chrome 65版本,如果你的 Chrome 开发者工具没有下文提到的那些内容,请检查下 Chrome 的版本 简介 Chrome 开发者工具是一套内置于 ...
随机推荐
- DOM 节点遍历:掌握遍历 XML文档结构和内容的技巧
遍历是指通过或遍历节点树 遍历节点树 通常,您想要循环一个 XML 文档,例如:当您想要提取每个元素的值时. 这被称为"遍历节点树". 下面的示例循环遍历所有 <book&g ...
- 二、Unity调用Xcode封装方法
1.开始封装Unity调用接口 我们在Xcode中 写的接口需要在extern "C"中(加上extern "C"后,会指示编译器这部分代码按C语言的进行编译) ...
- iOS的cer、p12格式证书解析监控
之前博客写过直接解析ipa包获取mobileprovision文件来监控APP是否过期来,但APP的推送证书还没有做, 大家都知道,iOS的推送证书不会放到ipa包里,只能通过直接解析p12或cer. ...
- 《Effective C#》系列之(三)——充分利用C#语言的新功能
在<Effective C#>这本书中,利用C#语言的新功能是其中一章的内容.以下是该章节的一些核心建议,以及使用C#代码示例说明: 利用自动属性:在C# 3.0中引入了自动属性,可以大大 ...
- async与await暂停作用
1. async function Request () { await new Promise(res => { setTimeout(() => { console.log(1) re ...
- Oracle 一些触发器自治事务相关错误
Oracle 一些触发器自治事务相关错误 table XXX is mutating,trigger/function may not see it 在触发器中调用的函数或者语句有查询当前表的操作,比 ...
- 教你如何进行Prometheus 分片自动缩放
本文分享自华为云社区<使用 Prometheus-Operator 进行 Prometheus + Keda 分片自动缩放>,作者: Kubeservice@董江. 垂直缩放与水平缩放 P ...
- SQL Server实战一:创建、分离、附加、删除、备份数据库
本文介绍基于Microsoft SQL Server软件,实现数据库创建.分离.附加.删除与备份的方法. 目录 1 交互式创建数据库 2 Transact-SQL指定参数创建数据库 3 交互式分离 ...
- 从no-code到low-code:企业级hpaPaaS的未来
简介: 本文将简单谈一谈基于 no-code > low-code > pro-code 渐进式思路的研发体系. 引子 宜搭负责人骁勇给我举过一个例子,我们小时候逢年过节穿的衣服,都是去裁 ...
- Spring Cloud Bus 消息总线介绍
简介: 本文配套可交互教程已登录阿里云知行动手实验室,PC 端登录 start.aliyun.com 在浏览器中立即体验. 作者 | 洛夜来源 | 阿里巴巴云原生公众号 本文配套可交互教程已登录阿里云 ...