2

私は JS を使用して MTG カード ジェネレーターを作成していますが、正規表現を使用してカード コストの整数をどのように置き換えるのか疑問に思っていました。(出版というより学習のため)

card_cost は、ユーザーからの単なる入力テキスト値です。整数をスペースで区切れるようにしたい IE: ユーザーが入力します: "10 1 2" Int は置き換えられる必要がありますが、スペースは保持する必要があります。

次のように開始します。

if(card_cost)
{
card_cost=card_cost.replace(/INTEGER/g,"<span class='card_costnum' src='numsymbol.png' ></span>");
}

ここでの試みは、数字ごとに背景画像を表示するために、整数をスパン内に保持されたものに置き換えることです。

これについて考える時間ができたので、整数の配列を取得して、スパン内でそれらを戻すことができるようにする必要があると想定しています。置換では、複数の整数を正しくキャッチするのに十分ではないと思います。

4

5 に答える 5

2

JavaScriptreplace関数で$&は、検索文字列自体を参照するので、次のように記述できます

someStr = "12 34 foo 5 bar"
someStr.replace(/\d+/g, "<span whatever>$&</span>")

戻り値

<span whatever>12</span> <span whatever>34</span> foo <span whatever>5</span> bar

各桁を個別に置き換えるには、単に削除し+ます：

someStr = "12 34 foo 5 bar"
someStr.replace(/\d/g, "<span whatever>$&</span>")

戻り値

 <span whatever>1</span><span whatever>2</span> etc
于 2012-04-22T08:36:37.483 に答える
1

すべての数字を削除するには:

if(card_cost)
{
    card_cost=card_cost.replace(/\d/g,'');
}

しかし、コメントに記載されているように、なぜそれspanがreplace().

質問の意図について次の説明を編集しました。

if(card_cost)
{
    card_cost = card_cost.replace(/(\d)/g,function(a,b){
        return '<span class="card_costnum" src="numsymbol.png">' + a + '</span>';
    });
}

JS フィドルのデモ。

上記は、一致したすべての数字を でラップしますが、すべてのspan数字に一致します。

if(card_cost)
{
    card_cost=card_cost.replace(/\b(\d+)\b/g,function(a,b){
        return '<span class="card_costnum" src="numsymbol.png">' + a + '</span>';
    });
}

JS フィドルのデモ。

このバージョンは、(1 つ以上の) 数字の単語境界境界シーケンスに一致し、それらの一致をspans でラップします。

参考文献:

于 2012-04-22T07:58:58.577 に答える
0

jQueryを使用していると仮定しましょう：

var theNumbers = card_cost.split(" ");
for (var i=0; i < theNumbers.length; i++) {
    $("#target_div").append("<span class='card_costnum'>"+theNumbers[i]+"</span>");
}

それはあなたが要求しているものとかなり似たものを達成すると思いますが、私は正規表現を使用していません。

于 2012-04-22T08:19:53.933 に答える
0 
if (card_cost) {
    card_cost = card_cost.replace(/(\d+)/g, '<span class="card_costnum_$1">$1</span>');
}

プラス CSS のような:

.card_costnum_42 {
    background-image: url('card_costnum_42.png');
}
于 2012-04-22T08:36:36.593 に答える
0 
if(card_cost)
{
    card_cost=card_cost.replace(/\d+/g,"<span class='card_costnum' src='numsymbol.png' ></span>");
}
于 2012-04-22T08:05:19.250 に答える