2012-02-11 43 views
2

id = "old- [id]"のスパンから "Some text"を取得し、id = "new- [id]"に入れる方法は?jQueryを使用してid要素の一部を取得する方法は?

<span id="old-1">Some text</span> 
<span id="new-1"></span> 
<span id="old-5">Some text</span> 
<span id="new-5"></span> 

私はsubstring()機能なしidのデジタル一部を取得する方法がわかりません。 私はより正しい解決策が存在すると思います。おかげさまで

+0

なぜ 'substring()'を使いたくないのですか? – elclanrs

+0

私はそれが将来のhtmlの変更のためにコードの柔軟性を損なうと思う。 – vlad

答えて

7

あなたの質問は、あなたが求めているものを完全には明らかではないので、私はあなたに別の例の束を提供します:

単一idにはに、あなたがこれを行うことができます:

$("#new-1").text($("#old-1").text()); 

の場合あなたはこれを上やりたいシーケンシャルIDの束を持って、あなたがこれを行うことができます:

for (var i = 1; i <= 5; i++) { 
    $("#new-" + i).text($("#old-" + i).text()); 
} 

を、それはHTMLだけでなく、テキストをだ場合は、中)(.textセクションの代わりに().htmlを使用することができます上記のコード。

$("#new-1").html($("#old-1").html()); 

または

for (var i = 1; i <= 5; i++) { 
    $("#new-" + i).html($("#old-" + i).html()); 
} 

あなたが「old-」で始まり、関係なく、それらにどのように多くの、何の数字ですが、それらのすべてを処理するIDを持つすべてのオブジェクトを検索したい場合は、可能性があり

$('[id^="old-"]').each(function() { 
    var newid = this.id.replace(/old/, "new"); 
    $("#" + newid).html($(this).html()) 
}) 

これは「old-」で始まるIDを持つすべてのオブジェクトのjQueryオブジェクトを作成し、宛先ID値を作成し、それを使用するには、「新しい」と「古い」を置き換えます。これを行いますHTMLをコピーするソースから目的地まで。

var matches = elem.id.match(/\d+$/); 
if (matches) { 
    var numString = matches[0]; 
} 
+0

詳細な対応をありがとうございます。最後から二番目の例は私が必要なものです。最後の例も素晴らしいです。 – vlad

+0

"$( '[id^=" old- "]')"はタブをループする必要があります。ありがとう! – Andrejs

0

:あなたはelemという名前の変数に指定されたオブジェクトを持っていて、id値のちょうど数値部分を抽出したい場合は

、あなたはこのような数値部分にマッチする正規expresssionを使用することができますこれはあなたが探しているものですか?

var id = 1; 
$('#new-'+id).text($('#old-'+id).text()); 
0

JavaScript paseInt()関数は、混合文字列/整数変数の整数部分のみを返します。 $( '#old-1).attr(' id ')の値を変数に格納し、それにparseIntを格納すると、数値だけが返されます。

+0

私はpaseInt()関数について知りませんでした、ありがとう。 – vlad

0

使用私はあなたがその要素のテキストを複製することができるようにする前に、手それを知らなくても、ID を取得したいと考えている。この

$(document).ready(function() { 
    var el = $("#old-1"); 
    var oldId = el.attr('id').replace(/[A-Za-z$-]/g, ""); 
    $("#new-" + oldId).text(el.text()); 
}); 
+0

もちろん、エラー処理も必要です... –

4

のようなものを。

これが正しい場合、この短いjQuery関数はそうするでしょう。

$('span').each(function() 
    { 
     var idnum = $(this).attr('id').match(/[\d]/); 
     $('#new-' + idnum).text($(this).text()); 
    } 
); 

デベロッパーa jsfiddleを作成しました。あなたがold-nスパンのすべてが対応new-nスパンにコピーするの内容が必要な場合

1

、これはそれを行う必要があります。

$('span[id^="old-"]').each(function() { 
    $('#new-' + this.id.split('-')[1]).html($(this).html()); 
}); 

デモ:http://jsfiddle.net/nnnnnn/bcXFf/

(通常、私は使用します.substr()これは、文字列内での位置がわかっているので、これを行うためですが、避けるように求めているので、代わりに.split()を使用しました。)

^="attribute starts with" selectorなので、上記のコードでは、 "old-"で始まるidですべてのスパンを選択し、次にそれぞれに対応する "new-"スパンを見つけて内容をコピーします。

0

私が使用します。昔からテキストを取得し、新しいに入れます

$(document).ready(function(){ 
    var spanText = $('#old-1').text(); 
    $('#old-1').text(null); 
    $('#new-1').text(spanText); 
}); 

。 これを行う必要がある場合は、複数のIDがあれば、それを通過するループを記述するか、$ .eachメソッドを使用してすべてのIDを反復処理する必要があります。

関連する問題