jQueryを使ってhtmlのテキストを式に変換するにはどうすればよいですか？

Question

jqueryを使用して単純なRPGゲームを作成していますが、JSが式を実行できる数値に文字列を変換する際に問題があります。だから、私は各キャラクターのクリックイベントがあるので、ユーザーが1つを選択すると、そのキャラクターのスパンのステータスにhtmlが変わります。私はそれらの番号を取って、私の攻撃ボタンのためにそれらを使用したいと思います。

私も4

HTMLで

<div class="row"> 
     <div class=" col-md-3 "><button id="atk">Attack!</button></div> 
    </div> 
    <div class="row"> 
     <p class=" col-md-2 ">Health: <span id="Hp"></span></p> 
     <p class=" col-md-2 ">Damage Output: <span id="Damage"></span></p> 
     <p class=" col-md-2 ">Enemy Health: <span id="eHp"></span></p> 
     <p class=" col-md-2 ">Enemy Damage Output: <span id="eDamage"></span></p> 
    </div> 

のjQueryを、ボタンがクリックされるたびに、メインキャラクターのダメージを

$("#atk").click(function(){ 
    foeHp= ($("#eHp").html()); 
    foeDmg= ($("#eDamage").html()); 
    mainHp= ($("#Hp").html()); 
    mainDmg= ($("#Damage").html()); 
// console.log(foeDmg); 


var enemyHp = eval(foeHp + (mainDmg -4)); 

Answer 1

代わりに増加したいと思いますevalの場合は、を探していますまたはparseInt()。

$("#atk").click(function() { 
 
    foeHp = parseInt($("#eHp").html()); 
 
    foeDmg = parseInt($("#eDamage").html()); 
 
    mainHp = parseInt($("#Hp").html()); 
 
    mainDmg = parseInt($("#Damage").html()); 
 
    var enemyHp = foeHp + (mainDmg - 4); 
 
    console.log("You did " + mainDmg + " damage."); 
 
    console.log("The enemy now has " + enemyHp + " HP."); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="row"> 
 
    <div class="col-md-3"> 
 
    <button id="atk">Attack!</button> 
 
    </div> 
 
</div> 
 
<div class="row"> 
 
    <p class="col-md-2">Health: <span id="Hp">7</span></p> 
 
    <p class="col-md-2">Damage Output: <span id="Damage">2</span></p> 
 
    <p class="col-md-2">Enemy Health: <span id="eHp">3</span></p> 
 
    <p class="col-md-2">Enemy Damage Output: <span id="eDamage">4</span></p> 
 
</div>

決して使用eval()、：あなたはのためので、すべての計算を行うことを心配する必要はありませんので、あなたは、整数として変数そのものを解析したほうが良いと思います重大なセキュリティ上の脆弱性につながる可能性があります。覚えて、eval is 'evil'！

希望すると便利です。 :)