javascript - 如何在不丢失查询参数的情况下查找和编辑元素的 href 值？

Question

如何<a>在页面中找到包含 href attr 的任何元素/dailyTickets/front/user.form.php，然后将其更改为/dailyTickets/front/contacts.form.php?

请注意，我希望将 URL 查询参数 (id) 保留在路径 (user.form.php) 之后。例如，改变这个：

<a id="User_648_648" href="/dailyTickets/front/user.form.php?id=648">ConseillerUser</a>

对此：

<a id="User_648_648"href="/dailyTickets/front/contacts.form.php?id=648">ConseillerUser</a>

我从这个开始，但我不知道如何结束它：

$('a[href*="dailyTickets/front/user.form.php"]').each(function () { 
    if ($(this).children().length == 0) { 
        ...........
    } 
});

Answer 1

不需要循环，jQuery 会自动为您执行此操作，只需直接使用选择器即可更改所有匹配的元素：

$('a[href*="dailyTickets/front/user.form.php"]').attr('href', function(i,href) {
    return href.replace('user.form.php', 'contacts.form.php');
});

Answer 2

这将解决问题并保留所有 GET 参数：

$('a[href*="dailyTickets/front/user.form.php"]').attr('href', function() { 
    var search  = '/dailyTickets/front/user.form.php',     // 'user.form.php'
        replace = '/dailyTickets/front/contacts.form.php'; // 'contacts.form.php'
    return this.href.replace(search, replace);
});

Answer 3

您可以使用pathnameAnchor 的属性来不更改主机、查询或哈希。

$('a[href*="dailyTickets/front/user.form.php"]').each(function() {
    this.pathname = "dailyTickets/front/contacts.form.php"; // don't assign to href
});
// or just
$('a[href*="dailyTickets/front/user.form.php"]').prop("pathname", "dailyTickets/front/contacts.form.php");