js 获取页面内链接
今天有同学问如何用 JS 正则表达式获取一段文本中的超链接,并对超链接进行处理,想了几分钟,写了下面的代码:
var re = /https?:\/\/[\w\.:~\-\d\/]+(?:\?[\w\d\-_&=%]+)?(?:#[^\s]+)?/i;
这个正则表达式处理这种类型的URL:
protocol://host:port/path?param=value#xxoo
想法是好的,但总要测试通过才可以,随即又写了一段获取页面内所有带有 src, href 属性的代码:
function getGoodUrls() {
var slice = [].slice, srcs, hrefs, links, hasAsk;
hasAsk = function(url){
return url ? (url.indexOf('http') === 0 && url.indexOf('?') > -1) : false;
};
srcs = slice.call(document.querySelectorAll('[src]'), 0);
srcs = srcs.map(function(dom){ return dom.src; }).filter(hasAsk);
hrefs = slice.call(document.querySelectorAll('[href]'), 0);
hrefs = hrefs.map(function(dom){ return dom.href; }).filter(hasAsk);
links = srcs.concat(hrefs);
return links
}
ok,开测:
links.forEach(function(s){
//加上中文看中文会不会被选中
s = s + '发大家看法';
console.log('%cbefore: ' + s, 'color:red;')
console.log('%cafter: ' + s.replace(re, function(href){
return '<a href="' + href + '"><img/></a>';
}), 'color: green');
});
结果,多数URL都还是通过了的,也有少部分无法通过,比如像:http://xx.oo?next=http://oo.xx
不过这个不算特别常见,暂时就算了,以后要用到再修改
js 获取页面内链接的更多相关文章
- JS获取页面数据执行Ajax请求
下面这个例子展示了如何使用js获取页面中元素的值,并且将这些值作为参数执行Ajax请求. $("#submit-task").bind("click", fun ...
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- 获取页面内iframe里面的元素
结构直接看图比较直接 这里window.frames获取的是iframe的数组 要记得给iframe加个ID才行 后面的记录会详细讲解 在父窗口获取页面内的iframe 里面的元素window.fra ...
- jquery、js获取页面高度宽度等
jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...
- JS获取页面传过来的值
利用JS获取页面的传值,此方法只适应Get传值. 获取页面之间的传值,在后台我们很容易获取,那我们在前台只利用JS怎么写呢? 在看代码之前你需要了解的 ① 参考:W3C Location 对象 Loc ...
- js获取页面所有搜索条件
<div class="search"> 产品简码:@Html.TextBox("ProCode", "") ...
- js获取页面缩放比例
今天在网上看到一位大神写的一篇文章,出处记不得了,只是因为我在做项目的时候需要用到所以看了一眼. 经理要求我把两张图表上下排列(非响应式的)改成可以适配浏览器的,刚开始只是想改样式,看到代码才发现原来 ...
- js获取页面url的方法
我们可以用javascript获得其中的各个部分 1, window.location.href 整个URl字符串(在浏览器中就是完整的地址栏) 本例返回值: http://ifisker.com/b ...
- js获取页面元素距离浏览器工作区顶端的距离
先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome) 网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript) ...
随机推荐
- [Unity3D]Unity3D游戏开发之Unity与Android交互调用研究
各位朋友,大家好,我是秦元培,欢迎大家关注我的博客,我的博客地址是blog.csdn.net/qinyuanpei.在前一篇文章中,我们研究了Android平台上Unity3D的手势操作并在之前的基础 ...
- 使用flex和bison实现的sql引擎解析
因为老师要求,近期在做oceanbase存储过程的实现,在oceanbase 0.4曾经是不支持存储过程的.实现的主要步骤主要包含 1.语法解析 2.词法解析 3.详细运行语法树的步骤 如今先来说说语 ...
- JS实现全选,用于界面批量操作向后台传值时使用
function seltAll(){ var chckBoxSign = document.getElementById("ckb"); //ckb 全选/反选的选择框id va ...
- Thrift实践
Thrift实践:(一)安装 -- 未完待续 1. 新建一个目录,C:\test\thrift-test,里面建2个子文件夹,client-node和sever-csharp,然后把Thrift官 ...
- SQLServer 2005 数据库定阅复制实现双机热备(主要是sharepoint 内容数据库)
原文:SQLServer 2005 数据库定阅复制实现双机热备(主要是sharepoint 内容数据库) 场景 公司最近的sharepoint的数据库服务器老是出问题,并且在一旦出现问题,就导致无法正 ...
- Spring Resource之ResourceLoader
ResourceLoader接口意味着任何实现的对象都能够返回Resource实例. public interface ResourceLoader { Resource getResource(St ...
- shell awk统计重复个数
awk是一个很强大的工具,一个常见的用法就是统计一个文件中重复的列值的个数,这也是面试时面试官经常问的一个问题. 举个例子: 有个文件file.log的内容如下: http://www.sohu.co ...
- leetcode[70] Simplify Path
题目的意思是简化一个unix系统的路径.例如: path = "/home/", => "/home"path = "/a/./b/../../ ...
- openwrt构建过程探索
参考网站:http://wiki.openwrt.org/doc/howto/buildroot.exigence 需要下载必要的库文件,编译器等... 1 首先要获得openwrt的源码,参考ope ...
- 实例学习SSIS(三)--使用包配置
原文:实例学习SSIS(三)--使用包配置 导读: 实例学习SSIS(一)--制作一个简单的ETL包 实例学习SSIS(二)--使用迭代 实例学习SSIS(三)--使用包配置 实例学习SSIS(四)- ...