jQuery如何显示title属性并附加到内部html

时间:2013-12-10 05:02:48

标签: jquery

抱歉,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>

6 个答案:

答案 0 :(得分: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

答案 1 :(得分:1)

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

答案 2 :(得分:1)

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

OR

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

尝试以上。

答案 3 :(得分:1)

试试这个

 $(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

答案 4 :(得分:1)

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

检查此示例。

答案 5 :(得分:1)

<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>