文件未打印"/>
html javascript .js 文件未打印
说明：
(0) 导入提供的js文件。该文件包含英国最常见婴儿名字的射击名单
将插入身体下方。
(1) 使用循环、getElementById()、createTextNode()、createElement() 和 appendChild() 创建一个包含名称的表。您可以使用 HTML 标签和 innerHTML 来完成这篇笔记的其余要求。
(2) 显示表中有多少个名字。
(3) 创建一个输入区供用户输入他们的名字和姓氏。并要求用户用空格分隔名字和姓氏。
(4) 验证输入中只有一个名字和一个姓氏。如果输入不符合要求，显示alert(“Wrong input”);
(5) 如果姓名通过了4的验证，则将名字插入表中并更新所有姓名的总数。
(6) 使用setAttribute设置表格的边框=1.
(7) 当用户从表中复制任何名字时，显示如下提示“NAME is copied!!”
这里是html代码
<!DOCTYPE html>
<html>
<head>
<script src="Baby_name_Short.js"></script>
</head>
<body>
<input type="text" id="fullNameInput" placeholder="Use a space to seperate">
<button onclick="addName()">Add a name.</button>
<p><span id="totalNames">0</span> names in the table</p>
<table id="name_table"></table>
<script>
// Create an array to store the added names
let addedNames = [];
// Function to create the table row for a name
function createTableRow(name) {
const tableRow = document.createElement("tr");
const nameCell = document.createElement("td");
nameCell.appendChild(document.createTextNode(name));
tableRow.appendChild(nameCell);
return tableRow;
}
// Function to add a name to the table
function addName() {
const fullNameInput = document.getElementById("fullNameInput");
const fullName = fullNameInput.value.trim();
// Validate the input format
const nameParts = fullName.split(" ");
if (nameParts.length !== 2) {
alert("Wrong input");
return;
}
const firstName = nameParts[0];
const lastName = nameParts[1];
// Add the first name to the table
const namesTable = document.getElementById("name_table");
const newRow = createTableRow(firstName);
namesTable.appendChild(newRow);
// Update the added names array
addedNames.push(firstName);
// Update the total number of names
const totalNames = document.getElementById("totalNames");
totalNames.textContent = addedNames.length;
// Clear the input field
fullNameInput.value = "";
}
// Set the border of the table
const namesTable = document.getElementById("name_table");
namesTable.setAttribute("border", "1");
// Alert when a name is copied
namesTable.addEventListener("copy", function(event) {
const copiedName = event.target.textContent;
alert(copiedName + " is copied!!");
});
// Populate the table with default names
for (let i = 0; i < names.length; i++) {
const name = names[i];
const newRow = createTableRow(name);
namesTable.appendChild(newRow);
addedNames.push(name);
}
// Update the total number of names with the count of added names
const totalNames = document.getElementById("totalNames");
totalNames.textContent = addedNames.length;
</script>
</body>
</html>
这里是 Baby_name_Short.js 文件
var Baby_Name_List = new String("David,John,Paul,Mark,James,Andrew,Scott,Steven,Robert,Stephen,William,Craig,Michael,Stuart");
这是我得到的输出
我已经将html文件和.js文件放在同一个文件夹中，但是当我运行代码时没有打印.js文件，有什么问题吗？我正在使用 visual studio 代码并在 macbook 上使用 chrome 运行它。
我在 chrome 中检查了控制台，它说 Uncaught ReferenceError: names is not defined
回答如下：更多推荐
html javascript .js 文件未打印
发布评论