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) ...
随机推荐
- Hibeernate中的两种分页方式
1. return getHibernateTemplate().executeFind(new HibernateCallback() { public Object doInHibernate(S ...
- Android中利用Handler实现消息的分发机制(三)
在第二篇文章<Android中利用Handler实现消息的分发机制(一)>中,我们讲到主线程的Looper是Android系统在启动App的时候,已经帮我们创建好了,而假设在子线程中须要去 ...
- 编译预处理 -- 带参数的宏定义--【sky原创】
原文:编译预处理 -- 带参数的宏定义--[sky原创] 如有转载请注明出处 编译预处理 -- 带参数的宏定义 前面为输出文件,后面为输入文件 gcc -E -o test.i test.c ...
- 【iOS】Xib的使用与File'Owner总结
一.XIB的适用范围 xib(也叫Nib)与storyboard一样是用来描写叙述界面的. storyboard描写叙述的是比較大型的,大范围.适合描写叙述界面跳转等. 二.XIB的使用 Xib是小范 ...
- 正则提取文本中的颜色值 #xxxx,不严谨版本
不严谨但兼容性最好: #[a-fA-F0-9]+ 增加严谨性: #[a-fA-F0-9]{1,6}
- CI框架 .htaccess 隐藏url在index.php解决方案
CodeIgniter(下面简称"CI")是一款国外优秀的PHP轻量级MVC框架,它支持PHP4和PHP5.是开发中小型可拓展性需求高的Web应用程序的利器.眼下你所见到的这个博客 ...
- ECharts图表系统 特性总览
最近在玩ECharts,感觉真心不错,在这里把官方的资料收集收集,给大家推荐一下下~ Architecture ECharts (Enterprise Charts 商业产品图表库) 提供商业产品常用 ...
- leetcode[60] Rotate List
题目:给定链表,和一个k,把链表的后k个旋转到前头,例如链表为: 1->2->3->4->5->NULL and k = 2, return 4->5->1- ...
- 实例学习SSIS(二)--使用迭代
原文:实例学习SSIS(二)--使用迭代 导读: 实例学习SSIS(一)--制作一个简单的ETL包 实例学习SSIS(二)--使用迭代 实例学习SSIS(三)--使用包配置 实例学习SSIS(四)-- ...
- Web服务器性能/压力测试工具http_load、webbench、ab、Siege使用教程
一.http_load 程序非常小,解压后也不到100K http_load以并行复用的方式运行,用以测试web服务器的吞吐量与负载.但是它不同于大多数压力测试工 具,它可以以一个单一的进程运行,一般 ...