1

以下のいくつかのjqueryコードは、段落内に要素を追加するのと同じようにうまく機能します. 私の問題は、最初の段落と、本文の段落数の繰り返し回数のみを表示していることです。以下のコードを確認してください。

<!DOCTYPE html>
<html> 
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<body>
<script type="text/javascript">
$(document).ready(function() {
$('p.content').each(function() {
var content = $(this).html();    
var beforeContent = "<em>";
var afterContent = "</em>";
$(this).html(beforeContent+content+afterContent)
});
})
</script>
<p class="content">Hex value of white is #FFFFFF;</p>
<p class="content">Hex value of black is #000000;</p>
<p class="content">Hex value of blue is #0000FF;</p>
</body>
</html>
4

3 に答える 3

0

ID一意である必要があります。ID同じ要素を別の要素に使用することはできません。代わりに使用class

更新を取得するために最初の要素のみが必要な場合は、使用します.first()

例:

$('p#content').first().html(getX+beforeContent+theRest+afterContent)

完全なコードは次のとおりです ( に変更id) class。

<!DOCTYPE html>
<html> 
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<body>
<script type="text/javascript">
$(document).ready(function() {
  var content = $('p.content').html();
  var X = /\b\w*x/; 
  var Y = /\b(\w*x)\b(.*)$/; 
  var getX = X.exec(content); 
  var getY = Y.exec(content); 
  var theFirst = getY ? getY[1]:null; 
  var theRest = getY ? getY[2]:null; 
  var beforeContent = "<em>";
  var afterContent = "</em>";
  $('p.content').first().html(getX+beforeContent+theRest+afterContent)
})
</script>
  <p class="content">Hex value of white is #FFFFFF;</p>
  <p class="content">Hex value of black is #000000;</p>
  <p class="content">Hex value of blue is #0000FF;</p>
</body>
</html>​

デモ: http://jsfiddle.net/qpBaS/

于 2012-12-28T01:56:38.127 に答える
0

それらすべてを実行したい場合は、p-tags をループする必要があります

<script type="text/javascript">
    $(document).ready(function() {
        $('p.content').each(function() {
            var content = $(this).html();
            var X = /\b\w*x/; 
            var Y = /\b(\w*x)\b(.*)$/; 
            var getX = X.exec(content); 
            var getY = Y.exec(content); 
            var theFirst = getY ? getY[1]:null; 
            var theRest = getY ? getY[2]:null; 
            var beforeContent = "<em>";
            var afterContent = "</em>";
            $(this).html(getX+beforeContent+theRest+afterContent)
        });
    })
</script>

次に、をに変更idしますclass

<p class="content">Hex value of white is #FFFFFF;</p>
<p class="content">Hex value of black is #000000;</p>
<p class="content">Hex value of blue is #0000FF;</p>
于 2012-12-28T01:58:31.667 に答える
0

これを変える

var content = $('p#content').html();
$('p#content').html(getX+beforeContent+theRest+afterContent)
<p id="content">Hex value of white is #FFFFFF;</p>
<p id="content">Hex value of black is #000000;</p>
<p id="content">Hex value of blue is #0000FF;</p>

に

 <p class="content">Hex value of white is #FFFFFF;</p>
<p class="content">Hex value of black is #000000;</p>
<p class="content">Hex value of blue is #0000FF;</p>
var content = $('.content').html();
$('.content').html(getX+beforeContent+theRest+afterContent)
于 2012-12-28T01:54:53.203 に答える