如何将html元素的值保存到javascript var中

Question

我正在制作一个计算器，我想获取p元素的当前值，将其保存到var中，并使用document.getElementById更改p元素的内容。 这是jsfiddle链接： http : //jsfiddle.net/GuardianWolfe/stzhfnLm/1/ 。 我目前正在使用此代码：

$(document).ready(function () {
    $("#plusButton").click(function () {
        var eqVal = document.getElementById("equation").value;
        document.getElementById("equation").innerHTML = eqVal + " +";
    });
});

但是它什么也没做。

Answer 1

有两个问题

1，P标签没有value属性，您应该使用innerHTML来获取值，

2，您的小提琴没有引用jquery，因此错误将发生在$(document).ready(

更新小提琴

如果您想用jquery做事情，只能使用这样

$("#plusButton").click(function() {
    var eqVal = $("#equation").text();
    $("#equation").text(eqVal + "Hei");
});

小提琴的jQuery代码

Answer 2

您有几个问题：

首先，jQuery不包含在您的JSFiddle演示中。 您可以通过左侧边栏中的Frameworks＆Extensions区域添加此文件。 因此，您的代码最初会引发以下错误：

未捕获的ReferenceError：未定义$

其次，具有ID equation的元素是p元素。 p元素没有value属性。 您可以改为使用innerHTML获取p元素的文本：

var eqVal = document.getElementById("equation").innerHTML;

第三，您已经在使用jQuery，那么为什么不使用jQuery？

var eqVal = $('#equation').text();
// Or
var eqVal = $('#equation').html();

最后，您也可以使用jQuery更新值：

$('#equation').html(eqVal + " +");

修改了JSFiddle演示 。

Answer 3

如果您使用的是jQuery，则可以像这样简单

这里的工作示例http://jsfiddle.net/stzhfnLm/6/

$(document).ready(function () {
    $("#plusButton").click(function () {
        var eqVal = $('#equation').text();
        $('#equation').html(eqVal + "Hei");
    });
});

Answer 4

首先，在您的代码中加载JQuery。

然后，更改您的代码，如下所示：

$(document).ready(function () {

    $("#plusButton").click(function () {

        var eqVal = $("#equation").html();  // Get value of p tag
        $("#equation").html() = eqVal + " +";  // Set value 
    });
});