如何使用enter将我的<li>元素追加到列表中？
使用enter键将<li>元素追加到列表中的方法如下：
- 首先，确保你已经创建了一个列表，并且有一个包含<li>元素的变量。
- 在HTML中，使用<ul>标签创建一个无序列表，或使用<ol>标签创建一个有序列表。
- 在JavaScript中，使用document.createElement()方法创建一个新的<li>元素。例如，可以使用以下代码创建一个新的<li>元素：
- 在JavaScript中，使用document.createElement()方法创建一个新的<li>元素。例如，可以使用以下代码创建一个新的<li>元素：
- 使用document.createTextNode()方法创建一个文本节点，并将文本内容赋值给新创建的<li>元素。例如，可以使用以下代码创建一个文本节点并赋值给新的<li>元素：
- 使用document.createTextNode()方法创建一个文本节点，并将文本内容赋值给新创建的<li>元素。例如，可以使用以下代码创建一个文本节点并赋值给新的<li>元素：
- 使用appendChild()方法将新创建的<li>元素追加到列表中。例如，可以使用以下代码将新的<li>元素追加到列表中：
- 使用appendChild()方法将新创建的<li>元素追加到列表中。例如，可以使用以下代码将新的<li>元素追加到列表中：
- 这将把新的<li>元素添加到列表的末尾。
完整的代码示例：
<!DOCTYPE html>
<html>
<head>
<title>使用enter键将<li>元素追加到列表中</title>
</head>
<body>
<ul id="myList">
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>
<script>
document.addEventListener("keydown", function(event) {
if (event.keyCode === 13) { // 按下enter键的keyCode为13
var newItem = document.createElement("li");
var textNode = document.createTextNode("新的列表项");
newItem.appendChild(textNode);
var list = document.getElementById("myList");
list.appendChild(newItem);
}
});
</script>
</body>
</html>这样，当你在页面上按下enter键时，就会将一个新的<li>元素追加到列表中。
相关·内容
1回答
如何交互地将文本作为列表项附加到HTML文档中的列表中，而不将列表项存储为javascript变量？
javascript、html、dom
这是一个关于javascript如何编译(我认为)以及文本如何附加到HTML文档的问题。
我遵循一个示例，因为我希望以交互的方式将一个元素添加到文档中的列表中。
我的html文件包含一个列表：
<ul id="sList"> </ul>
如果我像这样写javascript：
var textnode = document.createTextNode(s);
var node = document.createElement("li");
node.appendChild(textnode);
document.getElementByI
浏览 1提问于2015-10-08得票数 1
回答已采纳
2回答
检查输入是否与ul中的值重复。
javascript、list、cordova、for-loop
我的清单是这样的
<ul id="myList">
<li>Coffee</li>
<li>Tea</li>
</ul>
我想检查我从QR代码中扫描的纯文本是否是列表中项目的重复值。
var ul = document.getElementById("myList");
var items = ul.getElementsByTagName("li");
var check;
var myText = result.text;
var myTextTwo = myT
浏览 4提问于2016-07-07得票数 0
回答已采纳
3回答
从json对象到列表中屏幕的原始javascript打印项
javascript、ajax
我正在用原始的javascript编写一个程序。在这个程序中，我调用一个json对象，它返回一个项目列表及其价格-
[
{
"shopName": "The Coffee Connection",
"address": "123 Lakeside Way",
"phone": "16503600708",
"prices": [
{
"Cafe La
浏览 8提问于2015-04-04得票数 2
回答已采纳
3回答
附加到li元素的链接
javascript、html
我试图在列表项中添加一个a链接，但我很难找到如何通过textnode获取a链接。
所以基本上我想要的是
<li><a href="http://en.wikipedia.org/wiki/Bumble">Bumble</a></li>
我成功地得到了li的输出，我只是不明白我怎么把a元素作为输出的一部分。
这是所有的代码
//Process the JSON data
function processResponse (){
if (httpRequest.readyState === 4) {
浏览 0提问于2014-10-28得票数 0
回答已采纳
3回答
Javascript，追加节点添加整个数组而不是最后一个元素
javascript、html、arrays、textnode、createtextnode
所以我仍然在学习javascript，对于我的第一个列表项目，我已经可以将数组添加到HTML页面，但它不是将最后一个元素添加到每一行，而是将整个数组添加到每一行。如何将其更改为只添加最后一个元素？ HTML <!DOCTYPE html>
<html>
<head>
<title>Task Tracker</title>
<link rel="stylesheet" type="text/css" href="todo.css">
<scrip
浏览 35提问于2021-03-25得票数 0
回答已采纳
4回答
多个元素上的insertBefore只处理最后一个元素
javascript、required、appendchild、textnode
我有一个包含大量输入元素的表单，没有什么可以告诉用户哪些字段是必需的。问题是我无法访问它的HTML代码。
所以我写了这个JavaScript：
var allInputs = document.querySelectorAll("input");
var newItem = document.createElement("LI");
var textnode = document.createTextNode("(*)");
newItem.appendChild(textnode);
for (var i = 0; i <
浏览 1提问于2018-06-15得票数 1
4回答
将带有文本的元素添加到DOM树时出现问题
javascript、html、css
我创建了一个无序的元素列表，并尝试使用DOM操作添加一个新元素。
var newEl = document.create Element('li');
var newText = document.createTextNode('Hawaii');
var newEl = newEl.appendChild(newText);
document.getElementsByTagName('ul')[0].appendChild(newEl);
该元素被添加到ul元素中，但不是作为安莉元素添加的，因此我的新文本没有任何项目符号。
浏览 8提问于2020-02-17得票数 3
2回答
DOM操作
javascript、dom
新手的问题--这段代码是否足够有说服力地创建四个列表项？或者我应该使用documentFragment代替？代码看起来很好-- 。
创建的list和li变量
var list = document.getElementById("myList");
var li = null;
创建了x个列表元素和伴生文本节点
for(var i=1; i<=4; i++){
var li = document.createElement("li");
li.appendChild(document.createTextNode("Number " +
浏览 4提问于2014-09-04得票数 0
回答已采纳
3回答
如何在列表项中添加复选框、文本节点
javascript
我想动态地创建一个带有复选框的列表。为此，我动态地创建了列表项、复选框和文本节点。
我的问题是，我想在列表项中附加复选框和文本节点。怎么做？
脚本中的：
var name=x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue;
var list = document.createElement( "li" );
var cb = document.createElement( "input" );
cb.type = "checkbox";
cb.
浏览 5提问于2011-06-21得票数 0
4回答
使用javascript向Ul添加多个Li
javascript
对于onclick事件，我试图向UL添加多个LIs，不管我做了多少appendChilds，它都不会用这个方法添加多个Li。
var form = document.getElementById("form");
var newUl = document.createElement('ul');
var newLi = document.createElement('li');
newButton.addEventListener("click", function(){
form.appendChild(newUl);
new
浏览 3提问于2016-09-02得票数 1
回答已采纳
1回答
html中的"Insertbefore“函数
javascript、html、function
我需要使用‘插入之前’函数在有序列表中添加新单词，但不知道如何将预定义的单词"water“更改为任何可选单词。
码
function myFunction() {
var newItem = document.createElement("li");
var textnode = document.createTextNode("water");
newItem.appendChild(textnode);
var list = document.getElementById("Course registrati
浏览 3提问于2017-01-19得票数 0
回答已采纳
2回答
使用DOM JavaScript添加类
javascript、class、dom、dom-events
首先，我的问题可能是愚蠢的。真对不起。我是新手。
我试着理解多姆。所以我才要列个购物单。
在我的购物清单上，当我在列表中添加一个项目时，我也尝试添加一个类。另外，每个项目都有自己的删除按钮。但问题是，我无法向新项目添加类。我的代码就像那个html
<div class="container">
<h1>Shopping List</h1>
<p>Please write your ingredients</p>
<input id="userinput
浏览 4提问于2021-08-08得票数 0
回答已采纳
1回答
如何在html/css/javascript中的数组中添加仅存在` in‘标记的数据？
javascript、html、css
我是全新的HTML/CSS/Javascript fyi。因此，我使用一个ul标记和多个li标记，在html中有一个项目列表。我不明白为什么只有在有数据的情况下，我才能加入安莉。
例如:我正在使用防火墙作为我的后端。假设我们有一个名为myList的列表保存到firebase：
myList = ["dog", "cat", "pig"]
所以现在，如果我要使用这个列表，我需要3个li标记。
<ul>
<li>dog</li>
<li>cat</li>
<li>pi
浏览 8提问于2022-01-26得票数 -1
回答已采纳
3回答
使用循环使用此javascript获取结果时遇到问题
javascript
请帮我处理这个。我试图通过循环遍历列表来选择“li”项，单击时将颜色更改为绿色。如果我只是在没有循环的情况下这样做，它会选择整个列表并将颜色更改为绿色，而不是单独更改它(我不想这样做)。这是我的HTML和javascript。
function newItem(){
var list = document.createElement('li');
var input = document.getElementById('item').value;
var text =document.createTextNode(input);
list.a
浏览 1提问于2018-05-10得票数 1
回答已采纳
5回答
在中间加一个li，而不是附加或前置。
html、dom
我想在已经存在的UL列表中添加一个新的li。
的问题是，我想将它添加到预定义的索引中.
.append()和.prepend()正在将li添加到最后一个和第一个。
，让我说，我想在第二个孩子(李)，(蛇)之后加上李。
function myFunction() {
var node = document.createElement("LI");
var textnode = document.createTextNode("water");
node.appendChild(textnode);
document.getEle
浏览 4提问于2018-01-08得票数 0
2回答
如何在javascript中的ul中追加数组？
javascript、html、arrays、append
我在将名为phrases的数组附加到名为addPhraseToDisplay()的方法时遇到了问题。下面是数组：
class Game {
constructor() {
this.missed = 0; // this property will be used as a counter for the total of 5 tries
this.phrases = ["life is strange","success does not come easy", "seven swans swimming", "gues
浏览 0提问于2018-12-01得票数 0
4回答
如何使用javascript创建新列表并将列表项添加到新列表中
javascript
我试图创建一个新列表并将其添加到DOM中，然后将列表项添加到新列表中，并将文本节点添加到每个列表项中。这就是我到目前为止所做的，在尝试了几种方法之后，但仍然没有实现目标。任何帮助都是appreciated.The前4行代码的HTML片段，下面的代码就是JavaScript代码。再次感谢你在这方面的帮助。
<body>
<div id="nav"></div>
<script src="js/script.js"></script>
</body>
var newList = documen
浏览 12提问于2017-02-28得票数 2
回答已采纳
4回答
使用JavaScript ()通过window.prompt()添加列表项
javascript
我试图根据用户在window.prompt()中输入的内容添加有序列表项。这个是可能的吗？
下面是我的密码。抱歉，如果这太乱了，我对这件事还挺陌生的。任何帮助都是非常感谢的！
<!DOCTYPE = html>
<head>
<script type = "text/javascript">
var test = document.getElementById('list');
var item1 = window.prompt("Enter first item:");
浏览 11提问于2020-04-29得票数 0
回答已采纳
1回答
只向列表中添加新列表项
javascript、html
我对JavaScript相当陌生，所以寻找可能的最简单的解决方案(也不是寻找jQuery解决方案)。
只有当单击的列表项尚未在新列表中时，我才尝试将单击的列表项添加到新列表中。我成功地将单击的列表项添加到新列表中，但未能创建一个有效的if语句来检查当前项的新列表。
window.onload = function () {
var ul = document.getElementById('bulk');
ul.addEventListener('click', function (e) {
var target = e.t
浏览 1提问于2020-06-10得票数 0
回答已采纳
1回答
JavaScript脚本没有运行吗？
javascript、html、scripting
这段代码的目的是显示一个无序的HTML元素列表，但由于某些原因，它似乎不起作用。
我使用Sublime Text来编写脚本和HTML代码。我试着通过Chrome开发人员控制台执行脚本，但也不起作用。
// 1) Crear una lista desordenada con 10 elementos dentro usando un bucle for.
// Tener en cuenta que solo se le puede hacer un único appendChild al ul creado,
// asi minimizamos el tiempo de m
浏览 57提问于2018-07-19得票数 -1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频活动推荐
腾讯云开发者
