基于window.location.href的条件URL追加或重定向的Javascript

Question

基于window.location.href的条件URL追加或重定向的Javascript

javascripturlconditional-statementsappendbookmarklet

4

我试图创建一个书签小工具，当单击它时，将检查当前选项卡/窗口的URL是否包含'char1'和/或'char2'（给定的字符）。如果这两个字符都存在，则重定向到另一个URL；否则，分别附加当前URL。

我认为有比下面更优雅的陈述方式（目前对我来说已经完美运行），但是我对JavaScript的了解有限。以下是我的（笨拙且重复的）工作代码（抱歉）：

if (window.location.href.indexOf('char1') != -1 &&
    window.location.href.indexOf('char2') != -1)
{
    window.location="https://website.com/";
}
else if (window.location.href.indexOf('char1') != -1)
{
    window.location.assign(window.location.href += 'append1');
}
else if (window.location.href.indexOf('char2') != -1)
{
    window.location.assign(window.location.href += 'append2');
}

这个功能完全符合我的需求，但是说实话...它的表现并不太优美。

有没有更简单的方法来做这件事，也许使用变量或伪对象？或者有更好的代码吗？

- Wintermute

感谢roosteronacid提供的格式，我有点过分了，把代码留在书签形式中。非常感激那些贡献时间和代码的人。我没有预料到会这么快得到如此丰富的反馈。 -Wintermute - Wintermute

4个回答

2

一种（有点）重构dthorpe建议的方法：

var hasC1  = window.location.href.indexOf('char1')!=-1
var hasC2  = window.location.href.indexOf('char2')!=-1
var newLoc = hasC1 
               ? hasC2 ? "https://website.com/" : window.location.href+'append1'
               : hasC2 ? window.location.href+'append1' : '';

if (newLoc)
    window.location = newLoc;

调用 assign 方法等同于将一个值赋给 window.location，在该方法中你使用了加法赋值运算符 += 来完成这两个操作：

window.location.assign(window.location.href+='append2')

在调用assign方法之前，实际上会将"append2"分配到window.location.href的末尾，这使得它变得多余。

通过将window.location设置为一个变量，还可以减少DOM查找次数。

- Andy E

调用assign与将值分配给window.location相同... 这就是我想的，但脚本一直返回附加的URL到文档窗口而不是地址栏，而地址栏包含了JavaScript。History-1返回到前一个页面，地址栏中包含了附加的URL。所以我将其包装在assign函数中，试图强制它使用结果。它起作用了，但是多余的。顺便说一下，你的代码也在做同样的事情：返回附加的URL到文档窗口，而不是地址栏。 - Wintermute

感谢您抽出时间来帮忙。我尝试自己创建一些变量，但是它们没有解决；我不确定我做错了什么，但当时我的朋友的孩子们分散了我的注意力，他们正在拆我的房子哈哈... 我很感激您的建议。 - Wintermute

1

@Wintermute：没问题。你遇到的确实是一个奇怪的问题。你可以将window.location = newLoc改为window.location.assign(newLoc)，但正如我之前提到的那样，它们几乎是一样的。 - Andy E

1

我认为这可能与Firefox中的Javascript有关；它似乎将结果解释为字符串文字并将其加载到浏览器窗口中...？<code>.assign(newLoc)</code>按预期返回，现在正常工作得很好。还有一个新变量：<code>loc = window.location</code>。现在只需使用<code>loc.property</code>或<code>loc.function</code>。再次感谢Andy E's Head。 - Wintermute

1

有点可扩展的代码。我疯了吗？

var loc = window.location.href;
var arr = [{
  url: "https://website.com/",
  chars: ["char1", "char2"]
}, {
  url: loc + "append1",
  chars: ["char1"]
}, {
  url: loc + "append2",
  chars: ["char2"]
}];

function containsChars(str, chars)
{
  var contains = true;
  for(index in chars) {
    if(str.indexOf(chars[index]) == -1) {
      contains = false;
      break;
    }
  }
  return contains;
}

for(index in arr) {
 var item = arr[index];
 if(containsChars(loc, item.chars)) {
    window.location.href = item.url;
    break;
 }
}

- vooD

1

疯狂吗？不，但可能已经习惯了处理更大的事情 :) 如果在网站/域中实现，这将非常灵活和可扩展，从我所见。我想它对于检查查询字符串和/或搜索特别有用，您可以将用户重定向到相关的常见问题解答或特殊公告。很棒，但对于我的需求，这就像用核武器杀蚊子哈哈。 - Wintermute

0

变量位置 = window.location.href

if (location.indexOf('char1')!=-1 &&  location.indexOf('char2')!=-1)
{window.location="https://website.com/";} 
else if (location.href.indexOf('char1')!=-1) {window.location.assign(location+='append1');}
else if (location.indexOf('char2')!=-1) {window.location.assign(location+='append2');}

- Salil

简洁明了，正是我所喜欢的。使用2个变量loc=window.location和url=loc.href可以进一步减少代码量。但这也会违反location=""返回字符串而不是地址的规则。使用loc.assign()（与上述变量一起）可以纠正这个问题。我认为这是因为将字符串附加到位置时会将其转换为字符串文字，然后将其视为文档内容，因此它会转到文档窗口。感谢您的意见！ - Wintermute

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- dthorpe · Accepted Answer

我能看到的唯一优化是将冗余的"indexof"调用提取到变量中，然后测试这些变量。虽然这种改动不会对性能产生明显影响。

var hasChar1 = window.location.href.indexOf('char1') != -1;
var hasChar2 = window.location.href.indexOf('char2') != -1;
if (hasChar1)
{
   if (hasChar2)
   {
      window.location="https://website.com/";
   }
   else
   {
      window.location.assign(window.location.href+='append1');
   }
} 
else if (hasChar2)
{
    window.location.assign(window.location.href+='append2');
}