DOM 操作：认为有用
以下部分问题需要您编写一些DOM 操作代码来完成——例如，通过 JavaScript 创建新的 HTML 元素，将其文本内容设置为等于特定的字符串值，并将它们嵌套在页面上现有的元素内部。
我们尚未在课程中明确教授过这部分内容，但您应该会看到一些使用了它的示例，我们希望您能够自行研究需要哪些 DOM API 来成功回答问题。一个好的起点是我们的DOM 脚本入门教程。
循环 1
在我们的第一个循环任务中，我们希望您编写一个基本的循环，该循环遍历 `myArray` 中的所有项，并将它们显示在屏幕上，作为列表项（<li> 元素）的内部。它们应该被追加到提供的 `list` 中。
js
const myArray = ["tomatoes", "chick peas", "onions", "rice", "black beans"];
const list = document.createElement("ul");
const section = document.querySelector("section");
section.appendChild(list);
// Don't edit the code above here!
// Add your code here
点击此处显示解决方案
你完成的 JavaScript 应该看起来像这样
js
// ...
// Don't edit the code above here!
for (let item of myArray) {
const listItem = document.createElement("li");
listItem.textContent = item;
list.appendChild(listItem);
}
循环 2
在接下来的任务中，我们希望您编写一个简单的程序，该程序接收一个姓名，在一个包含姓名和电话号码的对象数组中进行搜索，如果找到该姓名，则将姓名和电话号码输出到一个段落中。
您将从以下三个变量开始
name：包含要搜索的姓名。para：包含一个段落的引用，将用于报告结果。phonebook：包含要搜索的电话簿条目。
注意：如果您尚未阅读对象相关内容，请不用担心！目前，您只需要知道如何访问成员-值对即可。您可以在JavaScript 对象基础教程中了解对象。
完成任务
- 编写一个循环，遍历（
phonebook）数组并搜索提供的name。您应该使用与上一个任务中不同的循环类型。 - 如果找到
name，则将其和相关的number写入提供的段落（para）的textContent中，格式为“<姓名>的电话是 <号码>。”之后，在循环完成之前退出循环。 - 如果没有对象包含
name，则将“在电话簿中未找到姓名”打印到提供的段落（para）的textContent中。
js
const name = "Mustafa";
const para = document.createElement("p");
const phonebook = [
{ name: "Chris", number: "1549" },
{ name: "Li Kang", number: "9634" },
{ name: "Anne", number: "9065" },
{ name: "Francesca", number: "3001" },
{ name: "Mustafa", number: "6888" },
{ name: "Tina", number: "4312" },
{ name: "Bert", number: "7780" },
{ name: "Jada", number: "2282" },
];
const section = document.querySelector("section");
section.appendChild(para);
// Don't edit the code above here!
// Add your code here
点击此处显示解决方案
你完成的 JavaScript 应该看起来像这样
js
// ...
// Don't edit the code above here!
for (let i = 0; i < phonebook.length; i++) {
if (phonebook[i].name === name) {
para.textContent = `${phonebook[i].name}'s number is ${phonebook[i].number}.`;
break;
}
if (i === phonebook.length - 1) {
para.textContent = "Name not found in the phonebook";
}
}
循环 3
在最后一个任务中，您将测试从 500 到 2 的每个数字，使用提供的测试函数找出哪些是质数，并打印出这些质数。
您将获得以下内容
i：初始值为500；用作迭代器。para：包含一个段落的引用，将用于报告结果。isPrime()：一个函数，传入一个数字，如果该数字是质数则返回true，否则返回false。
完成任务
- 编写一个循环，遍历从
500到2的每个数字（1 不被计为质数），并对每个数字运行提供的isPrime()函数。 - 对于不是质数的数字，继续下一个循环迭代。对于是质数的数字，将其与某种分隔符一起添加到段落的
textContent中。
您应该使用与前两个任务中不同的循环类型。
js
let i = 500;
const para = document.createElement("p");
const section = document.querySelector("section");
function isPrime(num) {
for (let i = 2; i < num; i++) {
if (num % i === 0) {
return false;
}
}
return true;
}
// Don't edit the code above here!
// Add your code here
// Don't edit the code below here!
section.appendChild(para);
点击此处显示解决方案
你完成的 JavaScript 应该看起来像这样
js
// ...
// Don't edit the code above here!
do {
if (isPrime(i)) {
para.textContent += `${i}, `;
}
i--;
} while (i > 1);
// Don't edit the code below here!
// ...