Question

在我在jQuery中添加的某些内容中获取<h3>标记时遇到一些麻烦。

非常简单，每个包含.gallery-icon类的div都会在其中附加包含锚title属性。

$(document).ready(function($) {

    $(".gallery-icon").each(function() {

        $(this).append($(this).find('a').attr('title'));

    });

});

我面临的问题是title只是插入而没有任何标签，即：

＆＃13;

<div class="gallery-icon">
  <a title="Yadda!" href="http://cdn.someecards.com/someecards/usercards/1343964507704_8609552.png"><img src="http://cdn.someecards.com/someecards/usercards/1343964507704_8609552.png" alt="Yadda!"></a>
  Yadda!</div>

＆＃13;

注意：Yadda!只是坐在gallery-icon div中，没有任何标签。我希望它包含在h3中。

理想情况下，它会读到：

＆＃13;

<div class="gallery-icon">
  <a title="Yadda!" href="http://cdn.someecards.com/someecards/usercards/1343964507704_8609552.png"><img src="http://cdn.someecards.com/someecards/usercards/1343964507704_8609552.png" alt="Yadda!"></a>
  <h3>Yadda!</h3>
</div>

＆＃13;

Answer 1

改变这个：

$(this).append($(this).find('a').attr('title'));

到此：

$(this).append($('<h3/>', {text: $(this).find('a').attr('title')}));

或者这个：

$('<h3/>', {
   text: $(this).find('a').attr('title')
}).appendTo(this);

$(".gallery-icon").each(function(i, elem) {
  $('<h3/>', {
    text:$(this).find('a').attr('title')
  }).appendTo(this);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div class="gallery-icon">
  <a title="Yadda!" href="http://cdn.someecards.com/someecards/usercards/1343964507704_8609552.png">
    <img src="http://cdn.someecards.com/someecards/usercards/1343964507704_8609552.png" alt="Yadda!">
  </a></div>

即便如此：

$(this).append('<h3>'+ $(this).find('a').attr('title') + '</h3>');

如何在H标签中包装jQuery内容？

1 个答案: