8

有人可以解释document.getElementById("demo")下面示例中该行的作用吗?

我知道 getElementById 获取了 demo 的 id,但 id 是此代码中<p id="demo"></p>到底在做什么?<p id="demo"></p>

document.getElementById("age")很清楚,因为它获得了作为输入的年龄的 id。

function myFunction() {
  var age,voteable;
  age = document.getElementById("age").value;
  voteable = (age < 18)? "Too young" : "Old enough";
  document.getElementById("demo").innerHTML = voteable;
}
<p>Click the button to check the age.</p>

Age:<input id="age" value="18" />
<p>Old enough to vote?</p>
<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

4

7 回答 7

6

您是正确的,因为该document.getElementById("demo")调用通过指定的 ID 为您获取元素。但是您必须查看语句的其余部分才能弄清楚代码对该元素的确切作用:

.innerHTML=voteable;

您可以在此处看到它innerHTML将该元素的 设置为 的值voteable

于 2013-10-29T11:12:20.813 回答
3

考虑

 var x = document.getElementById("age");

x是带有 的元素id="age"

现在看下面一行

var age = document.getElementById("age").value;

这意味着您正在获得具有id="age"

于 2013-10-29T11:11:13.300 回答
2

线

age=document.getElementById("age").value;

说'我称为'age'的变量具有id为'age'的元素的值。在这种情况下,输入字段。

线

voteable=(age<18)?"Too young":"Old enough";

在我称为“可投票”的变量中说,我按照规则存储值:

“如果年龄在 18 岁以下,则显示‘太年轻’,否则显示‘足够老’”

最后一行告诉将 'voteable' 的值放在 id 为 'demo' 的元素中(在本例中为 'p' 元素)

于 2013-10-29T11:15:30.477 回答
0

getElementById使用其返回对元素的引用id。元素input在第一种情况下是第,在第二种情况下是段落。

https://developer.mozilla.org/en-US/docs/Web/API/document.getElementById

于 2013-10-29T11:12:09.880 回答
0

在您的代码demo中是 id,您希望在单击事件发生后显示结果,但什么也没有。

你可以拿走任何东西

<p id="demo">

或者

<div id="demo"> 

它只是文档中的节点,您只想在其中显示结果。

于 2013-10-29T11:12:24.117 回答
0

document.getElementById("demo").innerHTML = voteable找到 id 为 demo 的元素,然后将voteable值放入其中;要么太年轻,要么太老。

如此有效地<p id="demo"></p>成为例如<p id="demo">Old Enough</p>

于 2013-10-29T11:13:20.233 回答
0

它只是一个选择器,可帮助您选择特定的标签<p id = 'demo'></p>元素,以帮助您在任何情况下(鼠标或键盘)更改行为。

于 2017-09-19T11:41:56.567 回答