用于动态更改超链接的Javascript不起作用

我尝试适应的Javascript根本不起作用。如何让它工作

问题：在我的工作场所，我们有很多超链接，我必须点击它们才能打开票号。但是所有的车票号码都被超链接到一个新的网站上，这个网站速度非常慢，我看这个问题还没有得到解决。有一个老网站，这是非常快，我想超链接直接我那里只有

e、 g.一个链接指向

但我想，每当我点击它，它会指引我到一个新的链接

注:

1.两个网站的基础数据库相同

2.company.com和oldwebe.com仅供解释

在我的示例中，3.7-12345是票号，但在给定的html页面上可能有许多这样的票号，只要我单击其中任何一个，就会打开该票号的旧网站

4.这是我第一次开始用Javascript编写代码

尝试的解决方案无效。我把这个脚本放在了TamperMonkey中

var href = "https://companysachinperf.com/newweb/TicketDetnumber.jspx?tNumber=7-12345"
var oldWebsiteLink = "https://oldwebe.company.com/xyz/Ticketnumber.jspx?tNumber=@id"
var elems = document.querySelectorAll('.comp-link');

for (var i=elems.length; i--;) {
    elems[i].addEventListener('click', function(e) {
        e.preventDefault();
        var hrefVal = this.getAttribute('href');
        var id = hrefVal.substr(hrefVal.lastIndexOf('/') + 1);
        var newLink = oldWebsiteLink.replace("@id", id);
        console.log(newLink);
        window.open(newLink,'_blank');

    }, false);
}

---

您可以通过以下方法实现这一点：将以URL开头的href减去查询字符串，然后将其href属性更改为新链接

我在这里使用：

a[href^=${old_link}]

获取以旧链接值开头的所有锚定标记a。这允许您忽略

？t编号=*

在链接的末尾

请参见下面的工作示例：

让旧链接=https://www.google.com; 让新链接=https://www.example.com/queries; 让links=document.queryselectoral`a[href^=${old_link}]`； […links].forEachlink=>link.href=new_link+'？'+link.href.split'？'[1]； /*这是不需要的，但用于证明链接已更改*/ a[href]^=https://www.example.com] { 颜色：红色； } 您可以更改链接的href属性，如下所示：

function new2old(new_address) {
  let old_address = "https://oldwebe.company.com/xyz/Ticketnumber.jspx";
  let t = "";
  t = new_address.substring(new_address.lastIndexOf('?'), new_address.length);
  return old_address + t;
}

let links = document.querySelectorAll("a");

for (const link of links) {
  link.href = new2old(link.href);
}

---

只需将其放在正文末尾的标记前，或在控制台中运行它。

您尝试的代码需要在生成id的行中进行轻微更正，使用=而不是/

var id = hrefVal.substr(hrefVal.lastIndexOf('=') + 1);

---

一种方法是：

// here we use the Arrow syntax form of an Immediately-Invoked Function
// Expression ('IIFE'); this function is encountered and then immediately
// invoked by the browser:
// (function(){ /*...code...*/ })() or
// (()=>{ /*...code...*/})()
(() => {

  // using document.querySelectorAll('a') to retrieve a NodeList
  // of all <a> elements in the document, and passing that
  // NodeList to Array.from() in order to use Array methods
  // on the discovered Nodes:
  let links = Array.from(document.querySelectorAll('a')),

      // the new path we want to create:
      newPath = '/xyz/Ticketnumber.jspx';

  // here we filter the links Array, again using an Arrow function:
  links.filter(

    // the first argument of the Array.prototype.filter() method
    // is always a reference to the current array-element of the
    // Array (here it's named 'anchor'); and this is passed into
    // the function:
    (anchor) => {

      // if the anchor.hostname is exactly-equal to the supplied
      // String:
      if (anchor.hostname === 'companysachinperf.com') {

        // we update/set the 'data-oldhref' attribute of the
        // current <a> element to the current value of the href
        // attribute (this is for demonstration purposes in the
        // demo, and is irrelevant to the performance/functionality;
        // it can be removed:
        anchor.dataset.oldhref = anchor.href;

        // we update the <a> element's hostname property to the
        // value of the supplied String:
        anchor.hostname = 'oldwebe.company.com';

        // we update the path to the new path:
        anchor.pathname = newPath;
      }
    })
// here we close the function statement, the parentheses that follow
// the function (the '()') can contain any arguments you wish to supply
// and those arguments will be available to the function; however they
// would need to be declared within the opening parentheses of the
// Arrow function:
/*    ((argumentA,argumentB) => {
        ...code...
      })(document.body,somethingElse);
*/
})();

/* 与功能无关，仅用于演示目的： */ a:以前{ 内容：attrref； } a:之后{ 显示：块； 内容：'\a假定为：'attrdata oldhref； }

---

为什么要用JavaScript在前端更改链接目的地？我建议在后端更好地实现这一点，而不是潜在地将用户发送到意外的网站。David我只想为我更改它，因为我是最终用户之一：，我不想为其他人更改它，这是有意义的！您是否可以发布一些具有代表性的HTML，让您了解正在使用的页面结构？理想情况下，您希望最终得到的“输入”或“原始HTML”以及“输出”或“更新HTML”？David，不幸的是，没有。因为我对HTML也不太熟悉。我能提到的是页面结构不是固定的。我得到的票号是在搜索关键字后得到的，比如说不正确的输出，票号列在网页的部分。在其他部分中，还有许多与错误输出相关的其他信息。我想让javascript跳过其他部分，当我点击任何带有我所放置格式超链接的票号时，它就可以工作了。David///所以当我点击旧链接时，你可以说一个javascript启动，并在新选项卡中指向新链接。在下一行控制台中。lognewLink；您正在控制台上打印。所以只需在chrome浏览器上按F12键，转到控制台选项卡并检查输出。联机窗口。opennewLink，“U blank”；这将在新窗口上打开新链接。所以，请检查浏览器中是否禁用了弹出窗口阻止程序。Mukund我使用firefox，弹出窗口阻止程序已被选中，我未选中，仍然存在问题。firefox还将在F12上显示开发者工具。检查正在生成的新url。。当您单击链接时，还要检查控制台上是否有任何js错误。几乎没有错误和警告，但是打开和新链接本身没有问题。此外，我没有看到我的javascript列在那里。请检查您是否在正确的位置添加了更改。或者，在控制台上运行您的代码，并通过单击链接检查输出。Nick，感谢您的详细回答。在替换为正确的代码链接后，我复制了6行代码，并将其放入TamperMonkey的新脚本部分。还是不行。您的答案是否只是解释代码，我必须对其进行一些工作才能得出完整的解决方案。从概念上讲，我已经理解了您的答案，但我还没有达到使用工作代码的目的it@Sach代码应该按原样工作。。。您是否将旧链接和新链接变量更改为所需的链接，而不使用？附在最后？哪一个？你指的是什么。我使用了这个代码窗口。onload=function{let old_link=；let new_link=let links=document.querySelectorAlla[href^=${old_link}]；

---

[…links].forEachlink=>link.href=new_link+'？'+link.href.split'？'[1]；}如下所述，该部件有时会意外工作，当删除历史记录后重新启动浏览器时，它会停止工作。而且没有固定的方法触发它，我将在TamperMonkey中为这种不一致的行为提出一个问题：old_link=companysachinperf.com/newweb/ticketnumber.jspx？tNumber=；让new_link=oldwebe.company.com/xyz/Ticketnumber.jspx？tnumber；let links=document.querySelectorAlla[href^=${old_link}]；[…links].forEachlink=>link.href=new_link+'='+'='+link.href.split'='[1]；伟大的真棒：非常感谢你的详细解释。非常好，很管用！其他人给出的解决方案也同样有效。我注意到我必须刷新网页才能让它工作。我将搜索一些方法来自动将刷新代码放入其中。在我自己的测试中，只要脚本在Tampermonkey中启用，就不需要刷新，而且如果加载的是相同的代码，则不需要刷新。但我非常欢迎你接受我所能提供的任何帮助。是的，这很奇怪，但我想我会把它停下来等待以后的调查，至少我让它工作了：