如何通過JavaScript

Question

我在幾頁以下網址（http://something.com）追加與轉向器URL所有HREF鏈接..

<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的noob。

從我的努力，與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。

UPDATE 我代替我的JavaScript與

<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都在沒有追加的方式相同。

Answer 1

嘗試......

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); 
}​ 

jsFiddle。

我編碼的參數，但如果你不想編碼，就像在你的例子中一樣，把呼叫放到encodeURIComponent()。

Answer 2

解決此問題的另一種方法是使用事件委派。此方法重寫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) 
    } 

} 

我也創建下面的函數到你的HREF擴展到基於當前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驅動的系統中。此外，鏈接仍然以原始形式顯示給用戶（這可以根據您在做什麼來選擇）。