0

私はこれを得たHTML

    <div id="oops_menuHldrs" 
        style=" border-top:5px solid #ccc; position:absolute; width:100%;  background:#343434; bottom:0px; left:auto;">

          <div style="position:absolute; background:#343434; border-radius:10px; border:1px solid #CCC; right:0px; top:-20px;  padding:5px;">


<table id="opps_menu_links"  width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td><span><a href="../?abt=us">About us</a> black_text | black_text</span></td>
        <td><span><a href="../?ourA=gent">Our Agents</a> black_text | black_text</span></td>
        <td><span><a href="../contact=us">Contact us.</a> black_text | black_text </span></td>
      </tr>
    </table>


 </div>

jQueryを使用して、すべて|を選択し、それらを赤色にするように指示されました。

私は次のようなものを試しました：

$('#opps_menu_links').html( 
        $('#opps_menu_links').text()
        .replace(/\|/,"<span style='color:#f00;'>|</span>"));

これにより、すべてが単一の赤に変換されます|

もちろん、これjQueryがなければ簡単で、それぞれに服を着せるだけ|です...しかし、できるだけ最小限のコードをspans使用してどのようにそれを行いますか?jQuery

何か助けはありますか？

4

2 に答える 2

1

以下のようにスクリプトを変更します

http://jsfiddle.net/xHasy/

$('#opps_menu_links').html($('#opps_menu_links').html( ).replace(/\|/g,'<span style="color:red;">|</span>'));
于 2013-10-29T11:04:20.620 に答える
1

"g"正規表現にグローバル一致パラメーターを配置するのを忘れたことを除いて、すべて正しいです。

.replace(/\|/g,
//-----------^----place this

最終的なコードは次のようになります。

$('#opps_menu_links').html( 
        $('#opps_menu_links').text()
        .replace(/\|/g,"<span style='color:#f00;'>|</span>"));
    //---------------^----------place here

フィドル

于 2013-10-29T11:06:40.407 に答える