Question

我正在与客户合作，我只允许使用javascript（不要问为什么我不知道）。他们没有jquery设置，他们不想要它（再一次我不知道为什么）

无论如何，页面上有一个链接，他们希望将href更改为页面加载。以下是链接结构。

<a class="checkout_link" title="Checkout" href="current_url">Checkout</a>

我想知道是否有任何方法可以使用基本的javascript为上面的链接更改页面加载的href？如果是这样我将如何去做呢？

由于

Answer 1

window.onload=function() {
  var links = document.links; // or document.getElementsByTagName("a");
  for (var i=0, n=links.length;i<n;i++) {
    if (links[i].className==="checkout_link" && links[i].title==="Checkout") {
      links[i].href="someotherurl.html";
      break; // remove this line if there are more than one checkout link
    }
  }
}

更新以包含更多获取链接的方式

document.querySelector("a.checkout_link"); // if no more than one
document.querySelectorAll("a.checkout_link"); // if more than one

更具选择性：

document.querySelector("a[title='Checkout'].checkout_link");

最新的浏览器有一个classList

if (links[i].classList.contains("checkout_link") ...

window.onload = function() {
  alert(document.querySelector("a[title='Checkout 2'].checkout_link").href);
}

<a href="x.html" class="checkout_link" title="Checkout 1" />Checkout 1</a>
<a href="y.html" class="checkout_link" title="Checkout 2" />Checkout 2</a>

Answer 2

以下是jsfiddle demo

你应该使用ondomready事件，但是在使用vanilla进行编码时它会变得非常棘手（建议使用JavaScript框架）。因此，作为替代方案（不是实现您尝试做的最佳方式），是使用窗口加载（根据您的要求）。在JavaScript中，我们附加了一个在窗口加载后更改<a>的href的函数：

HTML：

<a class="checkout_link" title="Checkout" href="current_url">Checkout</a>

基于JavaScript的标题是唯一的，并且还包含class属性中的checkout_link：

    window.onload = function() {
        var tochange = document.getElementsByTagName('a');
        for (var i = 0; i < tochange.length; i++) {
            //checks for title match and also class name containment
            if (tochange[i].title == 'Checkout' && tochange[i].className.match('(^|\\s+)checkout_link(\\s+|$)')) {
                tochange[i].href = "http://www.google.com";
                break;  //break out of for loop once we find the element
            }
        }
    }

Answer 3

您可以通过类名获取对象，请查看以下链接：http://snipplr.com/view/1696/get-elements-by-class-name/

然后用它来改变href。

无论如何改变链接的href没有id和没有jquery？

3 个答案: