jQuery如何顯示標題屬性並附加到內部html

Question

對不起，jQuery完全不熟悉。我想知道如何獲得title屬性並將其附加到href標記的內部html中。我無法修改html源代碼，但我必須能夠將標題文本附加到href標記內的文本末尾。感謝幫助社區。

<script style="text/javascript"> 
    $(document).ready(function() 
    { 
     $("#part4 > a").mouseover(function() {   
      $(this).next().html(("#part4 > a").attr("title")).toggle(); 
     }); 

     $("#part4 > a").mouseout(function() { 
      $(this).next().html(("#part4 > a").attr("title")).toggle(); 
     }); 
    }); 
</script> 
<div id="part4"> 
    <h2>4: Link and Title Attribute Demo</h2> 

    <a href="#" id="linkTitle" title="This is text from the title attribute, wrapped in a span tag, placed here by jquery."> 
    Hover over this text</a> 
</div> 

Answer 1

var text = $('#linkTitle').html(); 
$("#part4 > a").mouseover(function() {      
     $(this).html(text + $(this).attr('title')); 
}); 
    $("#part4 > a").mouseout(function() { 
     $(this).html(text); 
}); 

Answer 2

$(this).html($("#selector").attr("title")); 

OR

$(this).append($("#selector").attr("title")); 

嘗試以上。

Answer 3

試試這個

$(document).ready(function() 
{ 
    var text = $('#linkTitle').text(); 
    $("#part4 > a").mouseover(function() {      
    $(this).html(text + $(this).attr('title')); 
    }); 
    $("#part4 > a").mouseout(function() { 
    $(this).empty().append(text); 
    }); 
}); 

DEMO

Answer 4

試試這個

$(document).ready(function() { 
     $("#part4 > a").mouseover(function() {   
      var title = $(this).attr("title"); 
      var html = $(this).html(); 
      $(this).html(title); 
      $(this).attr("title",html); 
     }).mouseout(function() {   
      var title = $(this).attr("title"); 
      var html = $(this).html(); 
      $(this).html(title); 
      $(this).attr("title",html); 
     });    
    }); 

Live Demo

或

$(document).ready(function() { 
     function hovertoggle(dis) { 
      var title = dis.attr("title"); 
      var html = dis.html(); 
      dis.html(title); 
      dis.attr("title",html); 
     } 

     $("#part4 > a").mouseover(function() {   
      hovertoggle($(this)) ; 
     }).mouseout(function() { 
      hovertoggle($(this)); 
     });    
    }); 

Live Demo

Answer 5

http://jsfiddle.net/x6Xe3/

$(document).ready(function() 
    { 
     var linkTxt = '' 
     $("#part4 > a").hover(function() {  
      linkTxt = $(this).text(); 
      $(this).append($(this).attr("title")); 
     },function() { 
      $(this).text(linkTxt); 
     }); 
    }); 

檢查這個例子。

Answer 6

<script style="text/javascript"> 
    $(document).ready(function() 
    { 
     default_text = $('#part4 > a').text(); 
     $('#part4 > a').hover(   
      function(){ 
        $(this).html($(this).attr('title')); 
      }, 
      function(){ 
        $(this).html(default_text); 
      } 
     ) 
    }); 
</script>