0

emphasisテーブルの特定のセルにそのクラスを持つすべてのタグからのクラスを削除したいと考えています。次のように表のセルの内容を選択しています。

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

コードの別の場所では、次のunwrap()ように使用しています。

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

ただし、2つを組み合わせる方法がわかりません。私はこれを試しましたが、失敗しました:

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 は、<input>このような隠しフィールドの値として設定されています$('#answer').val(answer);。Gleb Kemarsky のソリューションは優れていますが、何らかの理由で入力フィールドの値が適用されません。

明確にするために編集#3 ...

私は<table>いくつかの行とセルを持っています。最後の行の最初のセルには、いくつかのコンテンツがあります(14 + 6 = <span class="emphasis">20</span>たとえば)。

var answer = $('tr.problem_display_work:last td:first').html();そのセルの HTML を取得してから、$('#answer').val(answer);hidden の値を更新します<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>

4

2 に答える 2

2

<span>回答からタグを削除する方法

5) HTML 要素のコピーを作成し、.unwrap()メソッドを適用します。

同じ問題が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)メソッドによって回答からすべての html タグを削除します.replace()

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>

.emphasis2)クラスをセレクターに追加します

$( '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)メソッドを使用する.find()

selectorAnswer = $( 'tr.problem_display_work:last td:first' );
selectorAnswer.find( '.emphasis' ).contents().unwrap();
于 2016-06-23T04:30:55.787 に答える
0

あなたの質問は明確ではありません。テーブルのすべてのセルから「強調」クラスを削除したいことを理解しています。解決策は..

$('tr.problem_display_work:last td:first').removeClass("強調");

于 2016-06-23T04:04:49.300 に答える