gpt4 book ai didi

javascript - 为什么我的代码在每个元素后都返回一个逗号?

转载 作者:行者123 更新时间:2023-12-04 08:51:14 27 4
gpt4 key购买 nike

我试图返回每个元素前面带有索引的数组,并删除每个元素后面的逗号。我能够使用 push() 将每个元素返回到一个新行但仍然无法获得编号列表。我试过使用 <li><ol>在我的 js 中 <div>也是。我在这里缺少什么?

// TODO keep the student list state in a global list

var roster = new Array("");

function addStudent() {
// TODO lookup the user entered text

var newStudent = document.getElementById("student").value;

// TODO store the new student name in global list

roster.push("<div>" + newStudent + "</div>");

// TODO render the entire list into the output div

roster.innerHTML = roster.join('');
document.getElementById("output").innerHTML = "Student List" + roster;

return false;
}

function init() {
// TODO register the onsubmit for 'theForm' to use addStudent

if (document && document.getElementById) {
document.getElementById('theForm').onsubmit = addStudent;
}
}
window.onload = init;
    <form action="#" method="post" id="theForm" novalidate>
<fieldset>
<legend>Enter a student name to add to the roster</legend>
<div><label for="student">Student Name</label><input type="text" name="student" id="student"></div>
<input type="submit" value="Add to Roster" id="submit">
<div id="output"></div>
</fieldset>
</form>
<!-- <script src="js/students.js"></script> -->

最佳答案

而不是依赖 innerHtml ,你应该从 roster 创建一个字符串.为了将其转换为有序列表,您应该用 <ol> 将结果字符串括起来。和 </ol> ,并添加 <li>标记到每个元素。请注意 roster数组应初始化为空数组,而不是包含 "" 的数组:

var roster = new Array();

function addStudent() {
// TODO lookup the user entered text

var newStudent = document.getElementById("student").value;

// TODO store the new student name in global list

roster.push("<div>" + newStudent + "</div>");

// TODO render the entire list into the output div

rosterStr = '<ol>' + roster.map(r => `<li>${r}</li>`).join('') + '</ol>';
document.getElementById("output").innerHTML = "Student List" + rosterStr;

return false;
}

关于javascript - 为什么我的代码在每个元素后都返回一个逗号?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64093642/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com