今天有同学问如何用 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 获取页面内链接的更多相关文章

  1. JS获取页面数据执行Ajax请求

    下面这个例子展示了如何使用js获取页面中元素的值,并且将这些值作为参数执行Ajax请求. $("#submit-task").bind("click", fun ...

  2. JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )

    1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...

  3. 获取页面内iframe里面的元素

    结构直接看图比较直接 这里window.frames获取的是iframe的数组 要记得给iframe加个ID才行 后面的记录会详细讲解 在父窗口获取页面内的iframe 里面的元素window.fra ...

  4. jquery、js获取页面高度宽度等

    jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...

  5. JS获取页面传过来的值

    利用JS获取页面的传值,此方法只适应Get传值. 获取页面之间的传值,在后台我们很容易获取,那我们在前台只利用JS怎么写呢? 在看代码之前你需要了解的 ① 参考:W3C Location 对象 Loc ...

  6. js获取页面所有搜索条件

    <div class="search">        产品简码:@Html.TextBox("ProCode", "")    ...

  7. js获取页面缩放比例

    今天在网上看到一位大神写的一篇文章,出处记不得了,只是因为我在做项目的时候需要用到所以看了一眼. 经理要求我把两张图表上下排列(非响应式的)改成可以适配浏览器的,刚开始只是想改样式,看到代码才发现原来 ...

  8. js获取页面url的方法

    我们可以用javascript获得其中的各个部分 1, window.location.href 整个URl字符串(在浏览器中就是完整的地址栏) 本例返回值: http://ifisker.com/b ...

  9. js获取页面元素距离浏览器工作区顶端的距离

    先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome)  网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript)       ...

随机推荐

  1. Qt 如何处理拖放应用程序参数时,中国

    你用 Qt 我们开发的应用程序.用户拖放文件到您的 exe 在.启动应用程序,在这个时候, main() 功能参数可以接收中国.如何正确处理它?非常easy,码如下面: QTextCodec *cod ...

  2. AngularJS应用开发思维之3:依赖注入

    找不到的API? AngularJS提供了一些功能的封装,但是当你试图通过全局对象angular去 访问这些功能时,却发现与以往遇到的库大不相同. $http 比如,在jQuery中,我们知道它的AP ...

  3. Dungeon Master poj 2251 dfs

    Language: Default Dungeon Master Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 16855 ...

  4. Model Validation in Asp.net MVC

    原文:Model Validation in Asp.net MVC 本文用于记录Pro ASP.NET MVC 3 Framework中阐述的数据验证的方式. 先说服务器端的吧.最简单的一种方式自然 ...

  5. AWK增强的文本处理shell特征--AWK完全手册

    AWK这是一个很好的文字处理工具. 它不仅 Linux 中也是不论什么环境中现有的功能最强大的数据处理引擎之中的一个. 本文主要摘录池中龙写的Unixawk使用手冊(第二版),对当中内容略微修改.感谢 ...

  6. 浙江大学PAT考试1009~1012(1010上帝是冠军。。)

    哎,pat1010即使java书面,只有java书面,还增加了两个点,,.啊,智商捉佳,主要pat有些不给明确的范围.造成遐想空间.. 还是按顺序介绍.. 题目地址:http://pat.zju.ed ...

  7. Java发送get及post请求工具方法

    import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import ...

  8. 一个简单的dom查询函数

    var regid = /^#([\w-]*)$/, regClass = /^\.([\w-]*)$/, regName = /^(div|a|p|ul|li|input|select|docume ...

  9. 2014年辛星PHP教程秋季版第一本即基础知识已经完工

    因为本人还是蛮重视秋季版的,因此一開始就决定要把它做好,因此体系划分的比較具体,如今把它的第一本写作完成,在百度的下载点是:点我去百度 ,它的五十多个实例代码在百度的下载点是:点我下载源代码 ,当然, ...

  10. [探索]点点轻博客搬家到WordPress(一)

    摘要:点点博客备份XML通过DiandianToWordpress-beta.sh(文末给出)搬家到Wordpress博客 本人曾使用过点点轻博客,也深知像点点博客,Lofter博客导出的XML文件不 ...