2009-05-20 98 views
10

我有以下的html:獲得的href的值從<a>標籤

<div class="threeimages" id="txtCss"> 
<a> 
     <img alt="Australia" src="/Images/Services%20button_tcm7-9688.gif"/> 
</a>   
    <div class="text" id="txtLink">    
     <h2> 
      <a href="/partnerzone/downloadarea/school-information/australia/index.aspx">Australia</a> 
     </h2>    
     <p>Land of the sunshine!</p>   
    </div> 
</div> 

現在,如果你看到有HREF在DIV ID「txtLink」,即Australia

我想這個在頁面的運行時相同的href值被複制到DIV ID「txtCss」的上述標籤,我的意思是,當我的網頁獲取顯示我的HTML將是如下:

<div class="threeimages" id="txtCss"> 
<a href="/partnerzone/downloadarea/school-information/australia/index.aspx"> 
     <img alt="Australia" src="/Images/Services%20button_tcm7-9688.gif"/> 
</a>   
    <div class="text" id="txtLink">    
     <h2> 
      <a href="/partnerzone/downloadarea/school-information/australia/index.aspx">Australia</a> 
     </h2>    
     <p>Land of the sunshine!</p>   
    </div> 
</div> 

請推薦一些代碼上方問題

+0

確保當您發佈代碼時,通過在每行前面放置4個空格,或者突出顯示代碼並單擊「代碼」按鈕,將其設置爲1和1 0秒就可以了。 – UnkwnTech 2009-05-20 11:04:26

+0

我認爲它是javascript – SilentGhost 2009-05-20 11:05:27

+0

你使用什麼樣的編程語言? PHP,ASP.NET,Python,純HTML ......? – Erik 2009-05-20 11:05:53

回答

11

更新
沒有的jQuery這裏有一個答案:https://stackoverflow.com/a/887348/11333
早在2009年,這是完全可以接受的使用jquery雖然:)

創建這樣的一個js文件:

$(document).ready(function() { 
    $('.threeimages').each(function(){ 
    $(this).DupeHref(); 
    }); 
}); 

jQuery.fn.DupeHref = function(){  
    var target = $(this).find(".text h2 a").attr("href"); 
    $(this).find("a").attr("href", target); 
} 

在html中引用jquery和這個javascript文件。 事情是這樣的:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <title>Test</title>   
    </head> 
    <body> 
     <div class="threeimages"> 
      <a> 
       <img alt="Australia" src="/Images/Services%20button_tcm7-9688.gif"/> 
      </a>   
      <div class="text">    
       <h2> 
        <a href="/partnerzone/downloadarea/school-information/australia/index.aspx">Australia</a> 
       </h2>    
       <p>Land of the sunshine!</p>   
      </div> 
     </div> 
     <div class="threeimages"> 
        <a> 
       <img alt="Belgium" src="/Images/Services%20button_tcm7-9689.gif"/> 
      </a>   
      <div class="text">    
       <h2> 
         <a href="/partnerzone/downloadarea/school-information/belgium/index.aspx">Belgium</a> 
       </h2>    
       <p>Land of beer and food!</p>   
      </div> 
     </div> 
     <script src="./content/js/jquery-1.2.6.min.js" type="text/javascript"></script> 
     <script src="./content/js/dupetargets.js" type="text/javascript"></script> 
    </body> 
</html> 
1

您可以使用:

var txtLink = document.getElementById('txtLink'); 
var a = txtLink.getElementsByTagName('a'); 
if (a != null && a.length > 0) { 
    var setLink = txtLink.parentNode.getElementsByTagName('a'); 
    if (setLink != null && setLink.length > 0) { 
     setLink[0].href = a[0].href; 
    } 
}  

我認爲這應該工作..

38

這是最簡單的回答不使用任何庫和作品唯一的事情是你想要

var tc = document.getElementById("txtCss"); 
var ary = tc ? tc.getElementsByTagName("a") : []; 
if(ary.length >= 2) 
    ary[0].href = ary[1].href; 
2

這是一個簡單易懂的代碼:

<html> 
    <head> 
    <script language="javascript"> 
    function simpleChangeURL(){ 
     var anchors = document.getElementsByTagName('a'); 
     if(anchors != null & anchors.length > 0){ 
      anchors[0].href = anchors[1].href; 
     } 
    } 

    function simpleChangeByAustraliaURL() 
    { 
     var anchors = document.getElementsByTagName('a'); 
     var images = document.getElementsByTagName('img'); 
     var imageNeeded; 
     var anchorNeeded; 
     if(images != null){ 
      for(var i = 0; i < images.length ; i++){ 
       if (images[i].alt == 'Australia') imageNeeded = images[i]; 
      } 
     } 
     if(anchors != null){ 
      for(var j = 0; j < anchors.length ; j++){ 
       if (anchors[j].firstChild.data == 'Australia') anchorNeeded = anchors[j]; 
      } 
     } 
     if(imageNeeded != null && anchorNeeded!= null){ 
    var imageAnchor = imageNeeded.parentNode; 
    imageAnchor.href = anchorNeeded; 

} 

    } 


    </script> 
    </head> 

    <body> 
    <div class="threeimages" id="txtCss"> 
    <a> 
      <img alt="Australia" src="/Images/Services%20button_tcm7-9688.gif"/> 
    </a>   
     <div class="text" id="txtLink" >    
      <h2> 
        <a href="/partnerzone/downloadarea/school-information/australia/index.aspx">Australia</a> 
      </h2>    
      <p>Land of the sunshine!</p>   
     </div> 
    </div> 
    <script> simpleChangeByAustraliaURL();</script> 
    </body> 
    </html>