Question

在printFullName（）函数中：

1。创建一个也名为fullName的局部变量。

2。为局部变量分配值“ Bill Smith”。

3。将列表项添加到HTML排序列表中，其ID为“ outputList”，并带有本地fullName变量作为数据。

在主要功能lab02localGlobal（）中：

1。将名称“ Judy Green”分配给fullName的全局变量版本。

2。将列表项添加到HTML排序列表中，其ID为“ outputList”，并带有全局fullName变量作为数据。

3。调用printFullName（）函数。

应显示如下： 1.朱迪·格林 2. Bill Smith

但是它始终显示以下内容：比尔·史密斯 1.比尔·史密斯

// global variables
var fullName;

fullName = "Judy Green";

function printFullName() {
"use strict";

  // declare variable
  var fullName;
  var output;

  // assign value to variable
  fullName = "Bill Smith";

  output = document.getElementById("outputList");
  fullName += "<li>" + fullName + "</li>";
  output.innerHTML = fullName;
}

function lab02localGlobal() {
"use strict";

   var output;

   output = document.getElementById("outputList");

   fullName = "<li>" + fullName + "</li>";
   output.innerHTML = fullName;

   printFullName();
}

Answer 1

那是因为您正在printFullName()函数中覆盖您的innerHTML。尝试附加到您在lab02localGlobal()中已经添加的内容。

您可以使用appendChild()方法。有关更多详细信息，请参见https://plainjs.com/javascript/manipulation/append-or-prepend-to-an-element-29/

Answer 2

由于您使用printFullName设置了fullName的值，但是它将覆盖原点fullName成为Bill Smith。您可以尝试以下代码：

// global variables
var fullName;

fullName = "Judy Green";

function printFullName() {
"use strict";

  // declare variable
  var fullName;
  var output;

  // assign value to variable
  fullName = "Bill Smith";

  output = document.getElementById("outputList");
  output.innerHTML += "<li>" + fullName + "</li>";
}

function lab02localGlobal() {
"use strict";

   var output;

   output = document.getElementById("outputList");

   fullName = "<li>" + fullName + "</li>";
   output.innerHTML = fullName;

   printFullName();
}

lab02localGlobal()

<div id="outputList"></div>

Answer 3

函数'lab02localGlobal（）'会不断替换'输出'元素的内容，而不是向其中添加/添加内容。

您应该更改行：

output.innerHTML = fullName;

收件人：

output.append(fullName);

将JS添加到HTML

3 个答案: