一行JavaScript代码获取页面中的所有超链接地址
因为我喜欢收集Web开发类的网址,平时对网址就很敏感。
我总结了一下我收集网址的几个阶段:
1.纯手工阶段,傻傻的阶段。
在这个阶段,主要是收集一些在页面中展现出来的网址,就是说,如果网址出现在HTML注释中
导致没有展现出来的话,我是不关注的。还有就是一些超链接的网址,但是超链接的网址收集很麻烦
不能直接复制,在IE中我总是右键选择超链接的属性,打开属性框,从那里面复制网址。
后来感觉这样太慢了,想到了一个稍微方便的方法,那就是点击超链接,打开新窗口,然后复制地址栏中的
网址,这样比以前方便多了。
2.使用浏览器提供的功能来复制网址
后来在使用火狐和Chrome的过程中发现这两种浏览器都提供了一个右键菜单---“复制链接地址”
这个发现真是令我高兴极了,好像发现宝贝一样。这样不用打开新窗口也能复制地址了。
3.使用程序分析内容的半自动化阶段
后来遇到了一种情况,一个网页里面有一个列表,是一个各个语言的开发工具的列表,和相应的下载地址。
我很高兴,因为能找到这么多好东西,但是我突然想到一个问题,我使用手工去一个一个的复制,是不是有点浪费时间的
感觉呢?这时我想到了使用程序去抓取页面内容,然后提取网址出来。
我首先想到了CURL和WGET,因为这两个是在命令行下面经常使用的下载东西的工具。
但是,我更喜欢GUI下面的工具,这时候,我想到了PHP的插件----
Snoopy也可以抓取页面内容,并且提供了相应的获取超链接的接口。其实,我还想到了Python和Ruby,
一开始我并没有想到使用JavaScript,因为有一个观念束缚了我,那就是JavaScript不能读写文件,它的运行环境主要限制在浏览器中。
所以,在Web开发中能读写文件的编程语言肯定多半是服务器端的语言。
突然有一天,突然在脑子中闪现了一个想法,CURL和WGET的原理不就是下载文件,然后进行内容分析吗?
那我把要抓取的网址在浏览器中打开不也相当于下载下来了吗?这样的话,我就可以使用JS在在Chrome或者FF的控制台来分析页面的内容了啊。
于是,接下来 我就研究怎样使用JS来实现我的需求,毕竟我是做前端开发的,相对于PHP和Python来说,JavaScript才是我最熟悉的。
于是就有了今天的这些感想。
今天的目的不是要展示代码的牛逼,而是想记录一下感悟。
今天的收获是:不要思维定势,不要拘泥于一种解决方案,有时候我们可以使用我们自己最熟悉的技术和方法来解决遇到的问题,我相信这个方法也
是最快和最稳妥的解决方案。
下面贴上我写的代码:
document.body.innerHTML.match(/http:\/\/[^\s<>]*\b/g);
写的可能不符合你的需求,肯定也会有错误抓取和漏掉的,因为我只是大概的写了一下,是供自己娱乐使用的,至少比自己手工一个一个的去复制快多了,我使用想说的是代码是次要的,思路才是最重要的。
有思路的人使用任何编程语言都能写出来。
一行JavaScript代码获取页面中的所有超链接地址的更多相关文章
- jQuery基础学习5——JavaScript方法获取页面中的元素
给网页中的所有<p>元素添加onclick事件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
- js获取页面中图片的总数
查看效果:http://keleyi.com/keleyi/phtml/image/9.htm 下面是完整代码: <html><body><div id="ke ...
- 翻译 | 一行 JavaScript 代码的逆向工程
原文地址:Reverse Engineering One Line of JavaScript 原文作者:Alex Kras 译者:李波 校对者:冬青.小萝卜 几个月前,我看到一个邮件问:有没有人可以 ...
- 用JavaScript,获取Table中指定的行、列
前言: 先要谢谢George Wing的慷慨赠书<悟透JavaScript>,让我更加感受到了技术交流的重要性,呵呵~ 进入正题,面试题中有一题:如何通过JavaScript获取Table ...
- 使用HTML5的JavaScript选择器操作页面中的元素
<!doctype html><html lang="en"> <head> <meta charset="UTF-8& ...
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- JavaScript实现获取table中某一列的值
JavaScript实现获取table中某一列的值 1.实现源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...
- 获取页面中任意一个元素距离body的偏移量
//offSet:等同于jQuery中的offSet方法,获取页面中任意一个元素距离body的偏移量function offSet(curEle) { var totalLeft = null; va ...
- 在某网站的登录页面登录时如果选择“记住用户名”,登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页面中存在一个超链接,单击超链接可以链接到第三个页面查看信息。若选择“
Response实现登录并记录用户名和密码信息 在某网站的登录页面登录时如果选择"记住用户名",登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页 ...
随机推荐
- IIS网站发布容易出现的几个问题
1. 更新版本或者重新安装.net Framework: 2. 更改配置文件节点: 3. 访问权限问题的更改:
- Ubuntu 14.10 编译 qt4.8.6
0. 假设你已经可以在上面写基本的C++程序.(即:c/C++开发环境已经就绪)1. $ sudo apt-get build-dep libqt4-dev 2. $ sudo apt-get ins ...
- MongDb添加嵌套文档
想添加嵌套文档,就需要创建2个实体类.如下图 usermodel.Student = student; 其中Student的类型就是StudentModel: 第一个实体类 ...
- 5.6.1 Boolean类型
Boolean类型是与布尔值对应的引用类型.要创建Boolean对象,可以像下面这样调用Boolean构造函数并传入true或false值. var booleanObject=new Boolean ...
- 9.PHP 教程_PHP运算符
PHP 运算符 在 PHP 中,赋值运算符 = 用于给变量赋值. 在 PHP 中,算术运算符 + 用于把值加在一起. PHP 算术运算符 运算符 名称 描述 实例 结果 x + y 加 x 和 y 的 ...
- 用于COB工艺的PCB设计指导
绑定角度尽量在45°之内,多于这个角度,绑定时候,银线不好打入焊盘.而且打入焊盘的尾部可能短路到相邻的焊盘,绑定焊盘之间的间距一般在4MIL为极限,半场的工艺一般就这样了.而且焊盘离被绑定的IC引脚最 ...
- Move WriteBuffer ReadBuffer String
在实际编程中,经常会用到Buffer,当string作为Buffer传值时需要注意的是 1, string的值的起始索引是1,千万记住! 2, 有时候需要先告诉系统去开辟出内存空间,用SetLengt ...
- jQuery tmpl index
<!-- 校验失败后显示 TODO--> <script id="checkError_table_tmpl" type="text/x-handleb ...
- HDU题解索引
HDU 1000 A + B Problem I/O HDU 1001 Sum Problem 数学 HDU 1002 A + B Problem II 高精度加法 HDU 1003 Maxsu ...
- 2014多校3 Wow! Such Sequence!段树
主题链接:http://acm.hdu.edu.cn/showproblem.php? pid=4893 这个问题还真是纠结啊--好久不写线段树的题了.由于这几天学伸展树.然后认为线段树小case了. ...