如何使用jquery获取元素的title属性并将其插入到元素之后？

Posted 2023-02-22

【中文标题】如何使用jquery获取元素的title属性并将其插入到元素之后？

【英文标题】：How to get title attribute of element and insert it after element using jquery?

【发布时间】：2017-03-01 05:29:36

【问题描述】：

我有一个包含这样的列表元素的列表...

<li class="first leaf">
  <a href="/admin/store/orders/view" title="View and process the orders.">View orders</a>
</li>

我想获取 title 属性并将其作为 div 附加在 <a> 之后，就像这样...

<li class="first leaf">
  <a href="/admin/store/orders/view" title="View and process the orders.">View orders</a>
  <div>View and process the orders.</div>
</li>

到目前为止，我在这里......

(function ($)     
  $('#block-menu-menu-admin-welcome li a').each(function () 
    $(this).append('<div>' + $(this).attr('title') + '</div>');
  );
)(jQuery);

但它不起作用。有人可以帮忙吗？

【问题讨论】：

您想要.after() 而不是.append()？ .after()works fine for me

【参考方案1】：

JQuery .append() 将 html 插入选定元素，但您需要在选定元素之后插入 html。请改用.after()。

$('#block-menu-menu-admin-welcome li a').each(function () 
    $(this).after('<div>' + $(this).attr('title') + '</div>');
);

$('a').each(function()
    $(this).after('<div>' + this.title + '</div>');
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="first leaf">
    <a href="/admin/store/orders/view" title="View and process the orders.">View orders</a>
  </li>
</ul>

【讨论】：

谢谢，但仍然无法正常工作。我用 console.log ('test') 打印了一条消息；它显示在控制台中，所以我知道 jquery 和 js 文件正在被注意到。

@Collins 代码在 sn-p 中工作。所以你的代码有问题。检查控制台是否有错误。

控制台中没有错误。感谢您的帮助，我可以看到它可以工作，我得调试一下

【参考方案2】：

循环中的第一个 this 是对锚点的引用。您必须将其梳理到其父元素并附加到该元素。

$(this).parent().append('<div>' + $(this).attr('title') + '</div>');

【参考方案3】：

这是给你的WORKING FIDDLE。

$(function()

     $('.first').append($('.first a').attr('title'));

);