JS 中如何让 String 继承 getElement

2021-06-07 21:39:24 +08:00
 zhuzhuaini

目前在学习 JS,主要目的是写一个油猴脚本,我的理解是油猴中写的 JS 脚本可以外挂在需要执行的网页当中。

目前我的需求是,先获取网页当中的 href 超链接(目前已经实现)

然后通过油猴的“GM_xmlhttpRequest”去访问这个超链接,并返回源码(这一步也已经实现)

剩下的就是解析源码了,但是我也需要获取源码中的节点嘛,那我本来获取 href 超链接可以使用 document.getElementsByClassName 的方式去获取,但现在返回回来的源码是一个 String 类型的数据,他没法使用类似 getElementsByClassName 的方法去定位,所以我来问问有没有什么方法可以实现让 String 数据继承,如果没有的话,我就要想办法用正则去实现了。。。

我看了其他人写的代码,基本上都用到了一些库可以解析,比如 request,Cheerio 啥的,但是我琢磨了下发现都似乎无法在油猴上实现导入这些库。

如果各位大佬有更好的方案也请指教。。

2111 次点击
所在节点    JavaScript
29 条回复
zhuzhuaini
2021-06-08 11:54:15 +08:00
@Rhilip 有的 网址是 http://www.dedecms.com/
我的脚本代码是
GM_xmlhttpRequest({
url: 'http://www.dedecms.com/',
onload: function(res){
var resp = res.response
console.log(resp)
}})
我目前是测试 所以我随便找了个网页(百度首页),把脚本通过油猴挂载到百度里 ,但是控制台输出的源码就是中文会是乱码
zhuzhuaini
2021-06-08 11:56:21 +08:00
@Rhilip 即时我设置 responseType 为 document 代码如下
GM_xmlhttpRequest({
url: '和谐',
responseType: "document",
onload: function(res){
var resp = res.response
console.log(resp)
}})
问题依旧
duan602728596
2021-06-08 12:40:33 +08:00
其实 jsdom 、cheerio 、linkedom 是可以在浏览器中使用的,只不过没提供浏览器能使用版本而已。
我现在在浏览器中处理 html 就是用的 DOMparser 和 cheerio (因为 DOMparser 不能在 webworker 的环境中使用)。
不过看来 LZ 也不一定会用 webpack 和 rollup,还是用 DOMparser 吧。
Rache1
2021-06-08 12:43:29 +08:00
@zhuzhuaini 😂 这个是取决于服务器的实现,服务器没有实现这一块的话,也没办法,只有自己转了
Rache1
2021-06-08 12:45:31 +08:00
@Rhilip 😂 我看文档里面写的是 「 responseType one of arraybuffer, blob, json 」,不过好奇为啥 document 也可以用(没有尝试)
Rache1
2021-06-08 12:46:49 +08:00
@Rhilip 看到了原生 xhr 的 responseType 可以设置 document
mopig
2021-06-08 13:15:48 +08:00
加上 overrideMimeType: 'text/html;charset=gb2312' 就行了 😁
zhuzhuaini
2021-06-08 13:44:09 +08:00
@mopig 秒啊! 可以封贴了
zhuzhuaini
2021-06-08 13:44:36 +08:00
感谢楼上的各位帮助 不胜感激!

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/781984

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX