使用的相关知识点：对子节点的添加：document.appendClild()
文本节点的创建：document.createTextNode()
元素节点的创建：document.createElement()
<!DOCTYPE html>
<html>
<head>
< charset=\"UTF-8\">
< ></ >
< >
window. = function() {
document.getElementById(\"btn\"). = function() {
//1.获取ul节点
var ulEle = document.getElementById(\"ulEle\");
//2、创建文本节点
var textNode = document.createTextNode(\"高松\");
//3、创建li节点<li></li>
var liEle = document.createElement(\"li\");
//4、将文本节点添加到li节点中
liEle.appendChild(textNode);
//5、将李li节点添加至ul节点中
ulEle.appendChild(liEle);
}
}
</ >
</head>
<body>
<input type=\"button\" value=\"添加\" id=\"btn\" />
<ul id=\"ulEle\">
<li>上海</li><li>新西兰</li><li>东京</li><li>莫斯科</li>
</ul>
</body>
</html> 继续阅读与本文标签相同的文章
上一篇 :
gulp和bable实时编译ES6代码实例讲解
下一篇 :
一些大学对维基百科持谨慎态度
-
Python快递鸟API接口对接（即时查询|物流跟踪|电子面单|单号识别）
2026-05-18栏目： 教程
-
免费物流快递单号查询API接口及使用教程
2026-05-18栏目： 教程
-
【译】Hadoop发生了什么？我们该如何做？
2026-05-18栏目： 教程
-
阿里云上云企业案例周刊·第2期
2026-05-18栏目： 教程
-
虚拟机模拟部署Extended Clusters（一）基础环境准备
2026-05-18栏目： 教程