Question

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

我理解getElementById获取了demo的ID，但ID为 在此代码中究竟做了什么？

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>

Answer 1

你是正确的，document.getElementById("demo")调用通过指定的ID获取元素。但是你必须查看语句的其余部分，以弄清楚代码对该元素的确切作用：

.innerHTML=voteable;

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

Answer 2

考虑

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

此处x是id="age"的元素。

现在看下面一行

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

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

的元素的值

Answer 3

行

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

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

该行

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

在我称之为'可投票'的变量中说我按照规则存储值：

“如果年龄低于18岁，则显示'太年轻'，否则显示'足够老'”

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

Answer 4

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

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

Answer 5

此处代码中demo是您想要在点击事件发生后显示结果的ID，而不是任何内容。

你可以采取任何行动

<p id="demo">

或

<div id="demo">

只是文档中的节点，您只想显示结果。

Answer 6

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

因此有效成为Old Enough

Answer 7

它只是一个选择器，可以帮助您选择特定的标记元素，这些元素可以帮助您在任何情况下（鼠标或键盘）更改行为。

在JavaScript中使用document.getElementById

7 个答案: