如何在JavaScript中使用内置函数更改属性值

How to change property value in JavaScript using built in function?

本文关键字：函数 属性 内置 JavaScript      更新时间：2023-09-26

我试图简单地改变某人的年龄值，这是一个属性值内的对象，我有点击一个按钮。我觉得这应该行得通??

<p id="demo"></p>
<button onclick="incrementAge()">Click me</button>
<script>
var person = {
    name:"Rich",
    age:25, 
    eyeColor:"blue"
};
document.getElementById("demo").innerHTML = person.name + " " + person.age;

function incrementAge(){
    return person.age += 1
}
</script>

您还需要重置页面上元素的内容:

<p id="demo"></p>
<button onclick="incrementAge()">Click me</button>
<script>
var person = {
    name:"Rich",
    age:25, 
    eyeColor:"blue"
};

function incrementAge(){
    person.age += 1;
    document.getElementById("demo").innerHTML = person.name + " " + person.age;
}
</script>

问题是document.getElementById("demo")。innerHTML没有绑定到HTML视图。

我猜你是想展现新时代。如果是这样，您需要用

更新innerHTML。
function incrementAge(){
    person.age += 1;
    document.getElementById("demo").innerHTML = person.name + " " + person.age;
}

我认为你的代码实际上是你所描述的工作，但效果与你期望的不同。

document.getElementById("demo").innerHTML = person.name + " " + person.age;

^这不是一个恒定状态的瞬态表达式。你的代码中并没有说"总是让这种情况发生"。它将做出一次又一次的改变。你应该做的是把它放在一个refreshNameAge()函数中，并在任何可能改变一个人的名字和年龄的函数之后调用它。或者，您可以使用Object.defineProperty将其绑定到属性getter/setter中，尽管这样最终会更加复杂。

相关文章：