javascript - Jquery没有选择正确的href

Question

这个脚本：

$(function() {
    $('a').each(function() {
        var href = $(this).attr('href');
        if ("a:not(http://)") {
            $(this).attr('href', '/' + href);
        }
    });
});

将斜线添加到每个链接，甚至包含“http://”的链接不知道为什么？我没有得到任何错误？

关于如何解决这个问题的任何想法？

Answer 1

你混淆了两件事：

• jQuery 选择器：

  $(function() {
      $('a:not([href^="http://"])').each(function() {
          var href = $(this).attr('href');
          $(this).attr('href', '/' + href);  
      });
  });
  

• 和纯javascriptif语句：

  $('a').each(function() {
     var href = $(this).attr('href');
     if (href.substr(0, 'http://'.length) == 'http://'){
         $(this).attr('href', '/' + href); 
     }   
  });
  

两者都做同样的事情。

请注意，它们将为 http 以外的其他方案生成无效链接（例如/https://example.com/index.html）。根据您使用的 HTML 代码的干净程度，您可以简单地查找冒号来识别绝对链接：

$(function() {
    $('a:not([href*=":"])').each(function() {
        var href = $(this).attr('href');
        $(this).attr('href', '/' + href);  
    });
});

Answer 2

First, you code is equal to the following

$(function() {
   $('a').each(function() {
      var href = $(this).attr('href');
      if(true) { $(this).attr('href', '/' + href); }   
   });
});

if you really want to update href based on condition, if statetment should be different:

$(function() {
   $('a').each(function() {
     var href = $(this).attr('href');
     if(href.indexOf('http://') == -1 ) { $(this).attr('href', '/' + href); }   
   });
});

Another way would be the one offered by @Yogu, where you simple don't loop for links which you are not going to update

Answer 3

只是 Yogu 的一个插件，

请记住，您在每个标签的上下文中。“在对象本身内部”。因此，您可以直接访问 href。

$('a').each(function() {
   if (this.href.substr(0, 'http://'.length) == 'http://'){
       this.setAttribute('href', '/' + href); 
   }   
});