Question

我有这部分代码

<a href='project.php?id=5'>test</a>

id号码可以有不同的长度，我只需要提取这个号码。是通过正则表达还是更好的方式？

修改

我有解决方案，适合我的问题，你的想法：

string.split('=')[2].split('\'')[0]

当字符串包含文本时。我敢肯定，该文本将始终具有相同的模式

Answer 1

假设您有字符串"<a href='project.php?id=5'>test</a>"

^{使用正则表达式来解析HTML可以快速实现真正的丑陋（如果a有更多属性会怎么样？如果有多个标签怎么办？）}

最干净的方法是将其转储到新的HTML元素中，并使用强大的本机内置DOM API而不是字符串将其作为HTML进行处理。

var temp = document.createElement("div");
temp.innerHTML = "<a href='project.php?id=5'>test</a>";
var url = temp.firstChild.href; // now contains project.php?id=5

现在我们可以使用更传统的工具来提取id

var id = url.split("=")[1]; // the first thing after =.

更一般地说，策略是：

创建empty element或fragment并将我们的HTML放在那里
使用DOM查询方法查找我们的元素，在这种情况下.firstChild已足够，但getElementsByTagName甚至querySelector可能有用。
获得属性后，它只是一个简单的字符串，我们可以安全地使用正则表达式，或者我们选择的任何其他字符串处理方法。

如果您不熟悉DOM API，this tutorial是一个很好的起点。这就是我们使用JavaScript处理文档的方式，并且知道它对您作为前端JavaScript开发人员的成功非常重要。

Fiddle

Answer 2

function parse(url){
    var result = { pathname: null, search: {} };
    var parts = url.split('?');
    result.pathname = parts[0];
    var search = parts[1];
    if(search){
        var ps = search.split('&');
        for(var i = 0; i < ps.length; i++){
            var p = ps[i].split('=');
            result.search[p[0]] = p[1];
        }
    }
    return result;
}

parse('project.php?id=5');

编辑：获取锚元素：

 var anchors = document.getElementsByTagName('a');
 for(var i = 0; i < anchors.length; i++){
     var a = anchors[i];
     if(a.innerHTML === 'test')
         console.log(parse(a.href));
 }

Javascript，正则表达式和链接

2 个答案:

Fiddle