1

最初の単語に適用されるこの h5 タグ内に javascript を使用してクラスを持つスパンを挿入したい:

<div class="container_skitter" style="width: 715px; height: 230px;">
   <div class="image">
      <a href="#">
      <div class="label_skitter" style="width: 715px; display: block;">
        <h5>Increase knife life</h5>
      </div>
   </div>
</div>

後

<div class="container_skitter" style="width: 715px; height: 230px;">
   <div class="image">
      <a href="#">
      <div class="label_skitter" style="width: 715px; display: block;">
        <h5><span class="firstword">Increase</span> knife life</h5>
      </div>
   </div>
</div>

このようなものですか？

<script>
    $('h5').html(function (i, html) {
    return html.replace(/(\w+\s\w+)/, '<span>$1</span>')
});
</script>

それを機能させることができないようです。

ありがとう

4

2 に答える 2

1

これを document.ready の下に追加します。DOM が完全にロードされる前にスクリプトが実行されるのが早すぎます。また、最初の単語のみを一致させる必要があるため、これで選択できます。/(\w+\s)/

$(document).ready(function(){
     $('h5').html(function (i, html) {
     return html.replace(/(\w+\s)/, '<span class="test">$1</span>')
     });
   });

フィドル

于 2013-05-17T18:03:33.567 に答える
0

あなたは正しい軌道に乗っています。JQuery なしでこれをやってみましょう!

<script>
    Array.prototype.slice.call (document.querySelectorAll ('h5')).forEach
      function (h5el) {
        // we will come here with h5el referencing an h5 of the document
        h5el.innerHTML = h5el.innerHTML.replace (/^(\w+)\s/, 
          '<span class="firstword">$1</span> ';
      });
</script>

このスクリプトをタグの直前または直後に配置すると、すべてのh5要素が変更されます。

于 2013-05-17T18:07:55.527 に答える