脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → JS正则获取HTML元素

JS正则获取HTML元素的方法

 更新时间：2017年03月31日 14:33:50   作者：Shikyoh  
这篇文章主要介绍了JS正则获取HTML元素的方法,结合实例形式分析了JS针对页面HTML元素正则操作相关技巧与注意事项,需要的朋友可以参考下

本文实例讲述了JS正则获取HTML元素的方法。分享给大家供大家参考，具体如下：

var html = $("#summaryTemplate").html();
var imageMath = /<img [^<,>]*(?=target-type=("|')replace("|'))[^/,<,>]*\/>/;
var scriptMath = /<script [^<,>]*(?=target-type=("|')replace("|'))[^/,<,>]*><\/script>/;
var linkMath = /<link [^<,>]*(?=target-type=("|')replace("|'))[^/,<,>]*\/>/;
alert(html.match(imageMath));
var ht="<img src='/11.jpg' target-type='replace' />asf   <img src='/12.jpg' target-type='replace' />        <img src='/13.jpg' target-type='replace' />";
ht.match(imageMath)

为什么Math返回的数组不是 多个Img对象，而是

["<img src="/11.jpg" target-type='replace' />", "'", "'"]

不明白。。。。

后来验证是我的错，正则中 有g配置，是否下移至下一个目标。

正确

var attrbuteMath = "(?:\\w+)\\s*(?:=[^{,},<,>]+)";
var srcMath = "src(?:=[^{,},<,>]+)";
var hrefMath = "href(?:=[^{,},<,>]+)";
var scriptMath = "<script\\s+(?:" + attrbuteMath + ")*><\/script>";
var ge = new RegExp(scriptMath,"gi");
// var html = "<script asdfsadf='asdfsaf' asf=aaadsdfsdf style='' src='' ><\/script>asdfsaf<script asdfsadf='asdfsaf' asf=''aa adsdfsdf  ><\/script>";
var html = $("#txtHtml").val();
var result = ge.exec(html);
alert(result);

g表示要搜索字符串出现的,而不是找到第一个匹配后就停止。如果还要模式不区分大小写,可以给第二个参数添加字符 i

PS：这里再为大家提供2款非常方便的正则表达式工具供大家参考使用：

JavaScript正则表达式在线测试工具：
http://tools.jb51.net/regex/javascript

正则表达式在线生成工具：
http://tools.jb51.net/regex/create_reg

希望本文所述对大家JavaScript程序设计有所帮助。

相关文章

  • JavaScript实现浏览器内多个标签页之间通信

    JavaScript实现浏览器内多个标签页之间通信

    这篇文章主要为大家详细介绍了JavaScript如何实现浏览器内多个标签页之间通信,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-04-04
  • javascript操作cookie_获取与修改代码

    javascript操作cookie_获取与修改代码

    javascript操作cookie_获取与修改代码，跟以前的方法有所进步，者使用类的方法。
    2009-05-05
  • JavaScript中entries()和Object.values()方法的使用

    JavaScript中entries()和Object.values()方法的使用

    本文详细介绍了JavaScript中的两个实用方法,entries()和Object.values(),下面就来介绍一下两个方法在遍历对象和数组时的应用,感兴趣的可以了解一下
    2024-12-12
  • 一文彻底理解JavaScript原型与原型链

    一文彻底理解JavaScript原型与原型链

    这篇文章主要介绍了一文彻底理解JavaScript原型与原型链，JavaScript中有许多内置对象，如:Object, Math, Date等，文章围绕主题展开主题详情，具有一定的参考价值，需要的小伙伴可以参考一下
    2022-08-08
  • js实现登录拖拽窗口

    js实现登录拖拽窗口

    这篇文章主要为大家详细介绍了js实现登录拖拽窗口，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2020-02-02
  • JavaScript中V8引擎的垃圾回收机制详解

    JavaScript中V8引擎的垃圾回收机制详解

    V8是Google开发的JavaScript引擎,采用分代垃圾回收机制自动管理内存,包括新生代和老生代,新生代使用Scavenge算法快速回收短生命周期对象,老生代使用标记-清除和标记-整理算法优化长期存活对象的回收,V8通过增量标记、并发GC和增量压缩等优化策略减少垃圾回收对性能的影响
    2025-02-02
  • JavaScript的Number对象的toString()方法

    JavaScript的Number对象的toString()方法

    toString()方法可以把Number对象转换成字符串，并返回此字符串，本文给大家介绍JavaScript的Number对象的toString()方法，对javascript对象方法相关知识感兴趣的朋友一起学习吧
    2015-12-12
  • Bootstrap Table表格一直加载(load)不了数据的快速解决方法

    Bootstrap Table表格一直加载(load)不了数据的快速解决方法

    bootstrap-table是一个基于Bootstrap风格的强大的表格插件神器。接下来通过本文给大家介绍Bootstrap Table表格一直加载(load)不了数据的快速解决方法，感兴趣的朋友一起看看吧
    2016-09-09
  • 微信小程序实现动态设置页面标题的方法【附源码下载】

    微信小程序实现动态设置页面标题的方法【附源码下载】

    这篇文章主要介绍了微信小程序实现动态设置页面标题的方法,涉及微信小程序button组件事件绑定及页面元素属性动态设置相关实现技巧,并附带完整源码供读者下载参考,需要的朋友可以参考下
    2017-11-11
  • layer弹出层全屏及关闭方法

    layer弹出层全屏及关闭方法

    今天小编就为大家分享一篇layer弹出层全屏及关闭方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08

最新评论