使用jQuery的unwrap()移除类

Question

我想从表的特定单元格中的所有标记中删除emphasis类。我选择的表格单元格内容如下：

var answer = $('tr.problem_display_work:last td:first').html();

在代码中的另一个地方，我像这样使用unwrap()：

$(".emphasis").contents().unwrap();

然而，我不知道如何将两者结合起来。我试过了，但失败了

var answer = $('tr.problem_display_work:last td:first').html().(".emphasis").contents().unwrap();

有什么想法吗？

编辑以澄清#1:我想要将HTML保存在标签中。所以，如果我有：14 + 6 = <span class="emphasis">20</span>，我想以14 + 6 = 20结束。

编辑以澄清#2:问题中的HTML正在被设置为像这个$('#answer').val(answer);这样的隐藏$('#answer').val(answer);字段的值。的解决方案是好的，但由于某些原因，它没有得到输入字段的值。

编辑澄清#3..。

我有一个带有一些行和单元格的<table>。在最后一行的第一个单元格中，我有一些内容(例如，14 + 6 = <span class="emphasis">20</span>)。

我使用var answer = $('tr.problem_display_work:last td:first').html();获取该单元格的HTML，然后使用$('#answer').val(answer);更新隐藏<input id="answer">的值。

当发生这种情况时，我希望将14 + 6 = <span class="emphasis">20</span>转换为14 + 6 = 20，作为隐藏<input id="answer">的值，但将其作为14 + 6 = <span class="emphasis">20</span>保留在表中。

编辑澄清#4..。

关键是删除任何带有<span>类的emphasis。

这个..。<span class="emphasis"><div class="fraction_display"><span class="numer_display">21</span><span class="bar_display">/</span><span style="border-top-color: green;" class="denom_display">23</span></div></span>

最终应该是..。<div class="fraction_display"><span class="numer_display">21</span><span class="bar_display">/</span><span style="border-top-color: green;" class="denom_display">23</span></div>

Answer 1

如何从答案中删除<span>标记

5)创建HTML-元素的副本并应用.unwrap()方法。

同样的问题是solved by Redu。

4)从答案中删除<span class="emphasis"></span> (没有嵌套标记)

​

var answer = $( 'tr.problem_display_work:last td:first' ).html();
$( '#answer' ).val( answer.replace( /<span class="emphasis">(.*?)<\/span>/g, '$1' ) );

.accent,
.emphasis {
  font-family: sans-serif;
  font-weight: bold;
  padding: 0 2px;
}
.accent   { background: yellow;  }
.emphasis { background: orange; }
table {
  margin-bottom: 12px;
}
td {
  border: solid 1px #999;
  padding: 2px 8px;
}

<table>
  <tr class="problem_display_work">
    <td><span class="accent">1</span> + <span class="accent">1</span> = <span class="emphasis">2</span></td>
    <td><span class="accent">2</span> + <span class="accent">2</span> = <span class="emphasis">4</span></td>
  </tr>
  <tr class="problem_display_work">
    <td><span class="accent">3</span> + <span class="accent">3</span> = <span class="emphasis">6</span></td>
    <td><span class="accent">4</span> + <span class="accent">4</span> = <span class="emphasis">8</span></td>
  </tr>
</table>

<input id="answer" size="70">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

​

3)从 method的答案中删除所有html标记。

​

var answer = $( 'tr.problem_display_work:last td:first' ).html();
$( '#answer' ).val( answer.replace( /<[^>]+>/g, '' ) );

.emphasis {
  background: orange;
  font-family: sans-serif;
  font-weight: bold;
  padding: 0 2px;
}
table {
  margin-bottom: 12px;
}
td {
  border: solid 1px #999;
  padding: 2px 8px;
}

<table>
  <tr class="problem_display_work">
    <td>1 + 1 = <span class="emphasis">2</span></td>
    <td>2 + 2 = <span class="emphasis">4</span></td>
  </tr>
  <tr class="problem_display_work">
    <td>3 + 3 = <span class="emphasis">6</span></td>
    <td>4 + 4 = <span class="emphasis">8</span></td>
  </tr>
</table>

<input id="answer">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

​

2)将.emphasis类添加到选择器中

​

$( 'tr.problem_display_work:last td:first .emphasis' ).contents().unwrap();

.emphasis {
  background: orange;
  font-family: sans-serif;
  font-weight: bold;
  padding: 0 2px;
}
td {
  border: solid 1px #999;
  padding: 2px 8px;
}

<table>
  <tr class="problem_display_work">
    <td>1 + 1 = <span class="emphasis">2</span></td>
    <td>2 + 2 = <span class="emphasis">4</span></td>
  </tr>
  <tr class="problem_display_work">
    <td>3 + 3 = <span class="emphasis">6</span></td>
    <td>4 + 4 = <span class="emphasis">8</span></td>
  </tr>
</table>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

​

1)使用 method

selectorAnswer = $( 'tr.problem_display_work:last td:first' );
selectorAnswer.find( '.emphasis' ).contents().unwrap();

Answer 2

你的问题不清楚，我知道你想把“强调”类从表格的所有单元格中删除。解决办法是..。

$('tr.problem_display_work:last td:first‘).removeClass(强调)；