Question

我是棱角分明的新手。我有regex获得所有anchor tags。我的注册表是

/<a[^>]*>([^<]+)<\/a>/g

我在这里使用match功能，

var str =  '<a href="mailto:abc.jagadale@gmail.com" style="color:inherit;text-decoration:inherit">abc.jagadale@gmail.com</a>'

所以现在我正在使用像

这样的代码

var value = str.match(/<a[^>]*>([^<]+)<\/a>/g);

所以，我希望输出为abc.jagadale@gmail.com，但我得到的字符串与input string完全相同。任何人都可以帮我这个吗？提前谢谢。

Answer 1

你为什么要重新发明轮子？

您正在尝试使用正则表达式解析HTML字符串，这将是一项非常复杂的任务，只需使用DOM或jQuery来获取链接内容，它们就是为此而制作的。

将HTML字符串作为jQuery / DOM元素的HTML。
然后获取此创建的DOM元素以获取所有a元素在它里面并将它们的内容返回到一个数组中。

这应该是你的代码：

var str = '<a href="mailto:abc.jagadale@gmail.com" style="color:inherit;text-decoration:inherit">abc.jagadale@gmail.com</a>';

var results = [];
$("<div></div>").html(str).find("a").each(function(l) {
  results.push($(this).text());
});

<强>演示：

var str = '<a href="mailto:abc.jagadale@gmail.com" style="color:inherit;text-decoration:inherit">abc.jagadale@gmail.com</a>';

var results = [];
$("<div></div>").html(str).find("a").each(function(l) {
  results.push($(this).text());
});
console.log(results);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

您需要捕获锚标记内的组。正则表达式已匹配内部组([^<]+)但是，匹配时，有不同的方法来提取内部文本。

使用Match函数时，它将返回匹配元素的数组，第一个匹配元素将匹配整个正则表达式，并且以下元素将匹配正则表达式中包含的组。

试试这个：

var reg = /<a[^>]*>([^<]+)<\/a>/g

reg.exec(str)[1]

只有当g标志不存在时，匹配函数才会返回数组。

查看https://javascript.info/regexp-groups以获取更多文档。

Answer 3

简

不要使用正则表达式。正则表达式是一个伟大的工具，不要误会我的意思，但它不是你想要的。 Regex cannot properly parse HTML只有在 限制，已知 HTML 的情况下才能用于此目的。

例如，尝试将content:">"添加到您的style属性中。你会看到你的模式现在失败或者给你一个不正确的结果。我不喜欢一直使用this quote，但我认为在这种情况下使用它是必要的：

有些人在遇到问题时会想“我知道，我会用正则表达式。“现在他们有两个问题。

使用内置函数。 jQuery让这很容易实现。有关演示，请参阅我的代码部分。它比任何正则表达式更容易辨认。

代码

页面中的

DOM

以下代码段获取实际页面上的所有锚点。

$("a").each(function() {
  console.log($(this).text())
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="mailto:abc.jagadale@gmail.com">abc.jagadale@gmail.com</a>
<a href="mailto:abc2.jagadale@gmail.com">abc2.jagadale@gmail.com</a>

字符串

中的

DOM

以下代码段获取字符串中的所有锚点（转换为DOM元素）

var s = `<a href="mailto:email3@domain.com">email3@domain.com</a>
<a href="mailto:email4@domain.com">email4@domain.com</a>`

$("<div></div>").html(s).find("a").each(function() {
  console.log($(this).text())
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="mailto:email1@domain.com">email1@domain.com</a>
<a href="mailto:email2@domain.com">email2@domain.com</a>

Answer 4

考虑到解析字符串的用例，而不是使用实际的DOM，看起来似乎是正则表达式，除非你想将HTML加载到document fragment并解析

获得所有匹配的一种方法是使用split：

var htmlstr = "<p><a href='url'>asdf@bsdf.com</a></p>"

var matches = htmlstr.split(/<a.+?>([A-Za-z.@]+)<\/a>/).filter((t, i) => i % 2)

使用带有split的正则表达式返回所有匹配项以及它们周围的文本，然后按索引％2进行过滤将减去正则表达式匹配。

使用JavaScript中的正则表达式从锚标记字符串中提取内部文本

4 个答案:

简

代码