包含字符串到数字中的 JS 变量

JS Variable containing a string into a number

本文关键字：JS 变量 数字 字符串 包含      更新时间：2023-09-26

我有一个函数，可以将HTML元素转换为变量。我不能使用 ParseInt（） 或 ParseFloat（），因为它们旨在处理字符串我不介意使用像Jquery这样的第三方库。

var myFunction = function() {
  var myopt1 = ("#myopt1").innerHTML;
  var myopt2 = ("#myopt2").innerHTML;
  var result = myopt1 + myopt2;
  document.getElementById("result").innerHTML = result;
};
<span id="myopt1">12</span>+<span id="myotp2">12 = <span id = "result"></span>
<br/>
<button onclick="myFunction()">Do Math

您显然对与parseInt()或parseFloat()有关的事情存在一些误解。 .innerHTML 属性返回一个字符串，parseInt()或parseFloat()将获取该字符串并将其转换为数字。 如果你试图在两个 DOM 元素上进行数字匹配，这正是你需要做的。

此外，声明：

("#myopt1").innerHTML

不工作。 在普通的Javascript中，你可以使用：

document.getElementById("myopt1").innerHTML

工作片段：

var myFunction = function() {
  var myopt1 = parseFloat(document.getElementById("myopt1").innerHTML);
  var myopt2 = parseFloat(document.getElementById("myopt2").innerHTML);
  var result = myopt1 + myopt2;
  document.getElementById("result").innerHTML = result;
};
<span id="myopt1">12</span>+<span id="myopt2">12</span> = <span id="result"></span>
<br/>
<button onclick="myFunction()">Do Math

错误总结：

  1. ("#myopt1").innerHTML不起作用。 .innerHTML是一个 DOM 属性，因此您需要先获取 DOM 元素，然后才能使用它。 您可以使用 document.getElementById() 获取 id 的 HTML 元素。
  2. 在对字符串进行数字数学运算之前，您确实需要使用parseInt()或parseFloat()将字符串转换为数字。
  3. myotp2在您的 HTML 中拼写错误。
  4. 您的 HTML 缺少将第二个数字括在 span 标记中的</span>。

所以，你有多个问题

1）在您的 HTML 中，"myopt2" 被误写为 "myotp2"

2） 您的 myopt2 span 的内部 html 是 "12 = " 而不是 "12"

3） 您错误地使用了 jQuery 样式的文档查询

4）你必须使用parseFloat（）或parseInt（）将innerHTML转换为数字，以执行加法而不是字符串连接

这是一个使用 jquery 的工作代码笔

.HTML：

<span id="myopt1">12</span>+<span id="myopt2">12</span> = <span id = "result"></span>


做数学

.JS：

var myFunction = function() {
  var myopt1 = parseFloat($("#myopt1").html());
  var myopt2 = parseFloat($("#myopt2").html());
  var result = myopt1 + myopt2;
  $('#result').html(result);
};
相关文章：