1

我的几个页面中有以下 URL（http://something.com）..

<a href="http://something.com">Home</a>
<a href="index.html">Index</a>
<a href="about.html">About</a>
<a href="contact.php">Contact</a>
<a href="#">Same</a>
<a hre="http://example.com/home.html">New Home</a>
<a href="../services.html">Services</a>

我想要的是将所有链接转换为...

<a href="http://this.com/?url=http://something.com">Home</a>
<a href="http://this.com/?url=http://something.com/index.html">Index</a>
<a href="http://this.com/?url=http://something.com/about.html">About</a>
<a href="http://this.com/?url=http://something.com/contact.php">Contact</a>
<a href="#">Same</a>
<a hre="http://this.com/?url=http://example.com/home.html">New Home</a>
<a href="../services.html">Services</a>

所以基本上我不想转换"#"或"../"这样的链接。

我是 JS 的菜鸟。

在我的努力下，在 w3schools 的帮助下.. 我试图完成的事情：-

<script type="text/javascript">
var url= document.getElementByTagName(a);
var pattern = /..\//g;
var result = pattern.test(url);
if(url.href != "#" || result === "false" ) {
var nurl = url.replace("http://this.com/?url="+url.href, url.href);
}
</script>

而且我无能为力...请帮助，我该如何修改 URL 并添加http://this.com/?url=My_web_page_url_here.

更新 我用

<script type="text/javascript">
var links = document.links;
var i = links.length;

while (i--) {
    if (links[i].href.slice(-1) == "#" || 
        links[i].getAttribute("href").slice(0, 3) == "../") {
        continue;
    }
    links[i].href = "http://this.com/?url=" + encodeURIComponent(links[i].href);
}​
</script>

并且仍然所有 url 都以相同的方式没有附加。

4

2 回答 2

2

试试这个...

var links = document.links;
var i = links.length;

while (i--) {
    if (links[i].href.slice(-1) == "#" || 
        links[i].getAttribute("href").slice(0, 3) == "../") {
        continue;
    }
    links[i].href = "http://this.com/?url=" + encodeURIComponent(links[i].href);
}​

js小提琴。

我对参数进行了编码，但如果您不想对其进行编码，就像在您的示例中一样，请放弃对encodeURIComponent().

于 2012-11-25T10:08:15.633 回答
0

解决此问题的另一种方法是使用事件委托。此方法在使用链接时（而不是之前）重写 URL ：

window.onload = function(){

  var de = document.documentElement || document.body;
  /// an event listener that steps in at the point the user has
  /// clicked any element on the page. We specifically detect for
  /// links and redirect the outcome
  var proxyLink = function(e,t,href){
    /// handle old versions of IE
    e = e || Event; t = e.target || e.srcElement;
    /// hashs can occur at the end of external links, so am only checking
    /// your specific case. Switched to using getAttribute so as to get
    /// the original href string.
    if ( t.getAttribute('href').charAt(0) === '#' ) return;
    if ( t.getAttribute('href').indexOf('../') === 0 ) return;
    if ( String(t.nodeName).toLowerCase() == 'a' ) {
      if ( e.preventDefault ) { e.preventDefault(); }
      href = makeHrefAbsoluteIfPossible(t.href);
      window.location = 'http://this.com/?url='+encodeURIComponent(href);
      return (e.returnValue = false);
    }
  }

  /// add the listener to the body or document element, this will trigger
  /// the event onclick thanks to event bubbling.
  if ( de.addEventListener ) {
    /// handles modern browsers
    de.addEventListener('click', proxyLink, true);
  }
  else {
    /// handles old IE
    de.attachEvent('onclick', proxyLink)
  }

}

我还创建了以下函数，以根据当前的window.location. 我永远不确定哪些浏览器会返回绝对 URL 或原始 href 文本，所以这个函数只是以防后者发生：

function makeHrefAbsoluteIfPossible( href ){
  var path;
  if ( href.indexOf(':') == -1 ) {
    if ( href.charAt(0) == '/' ) {
      path = href;
    }
    else {
      path = String(window.location.pathname);
      if ( path.indexOf('/') != -1 ) {
        path = path.substring(0,path.lastIndexOf('/')) + '/';
      }
      path += href;
    }
    return window.location.protocol +'://' +
      window.location.host + path;
  }
  return href;
}

工作示例（使用警报而不是重定向）：

http://jsfiddle.net/teykz/2/

这种方法的好处是它可以与在运行时生成新的 html 内容的应用程序一起工作……这通常发生在 AJAX 驱动的系统中。此外，这些链接仍然对用户显示为原始链接（这可能取决于您正在做什么）。

于 2012-11-25T10:36:53.793 回答