使用jQuery删除span

Question

我有一个动态循环，可以生成类似于以下代码段的输出。我需要删除<span><i>和<br>，然后将文字保留在链接中。我尝试过以下方法：

＆＃13;

＆＃13;

$('#links a').each(function(){
    var this = $(this),
    span = this.find('span'),
    text = span.text();

    span.remove();
    this.append(text);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="links">
  <a href="/1">
    <span class="inline">
      <i class="fa fa-question"></i>
      <br>Help
    </span>
  </a>

  <a href="/2">
    <span class="inline">
      <i class="fa fa-gear"></i>
      <br>Fix
    </span>
  </a>
</div>

＆＃13;

＆＃13;

＆＃13;

没有得到预期的结果。我错过了什么？

Answer 1

this 是JS中的保留关键字。您需要将this更改为其他内容：

$('#links a').each(function(){
    var $this = $(this),
    span = $this.find('span'),
    text = span.text();

    span.remove();
    $this.append(text);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="links">
  <a href="/1">
    <span class="inline">
      <i class="fa fa-question"></i>
      <br>Help
    </span>
  </a>

  <a href="/2">
    <span class="inline">
      <i class="fa fa-gear"></i>
      <br>Fix
    </span>
  </a>
</div>

Answer 2

您可以使用解决方案

$('#links a').each(function(){
    var text = $(this).text();
    $(this)
      .empty()
      .append(text);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="links">
  <a href="/1">
    <span class="inline">
      <i class="fa fa-question"></i>
      <br>Help
    </span>
  </a>

  <a href="/2">
    <span class="inline">
      <i class="fa fa-gear"></i>
      <br>Fix
    </span>
  </a>
</div>

首先将文本放入变量中，然后使用empty方法＆amp;删除子元素。在最后附上文本。