使用的相关知识点:对子节点的添加:document.appendClild()

文本节点的创建:document.createTextNode()

元素节点的创建:document.createElement()

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function() {
document.getElementById("btn").onclick = 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);
}
}
</script>
</head>
<body>
<input type="button" value="添加" id="btn" />
<ul id="ulEle">
<li>上海</li><li>新西兰</li><li>东京</li><li>莫斯科</li>
</ul>
</body>
</html>

最新文章

  1. PALIN - The Next Palindrome 对称的数
  2. nginx配置杂记
  3. ng-repeat里创建的自定义指令
  4. mongoosejs model mapping to collection name
  5. Error
  6. SQL加、查、改、删、函数
  7. Android AlarmManager报警的实现
  8. Linux常见命令整理(一)
  9. Java编程之反射中的注解详解
  10. 最新eclipse国内镜像站,比ustc等站点资源新。
  11. Java笔记:Java 流(Stream)、文件(File)和IO
  12. ios swift例子源码网址总结
  13. Dynamics CRM2013 注释中的内容无法正常显示问题
  14. mySQL简单操作(三)
  15. Gson如何解析key值是数字的json数据
  16. Java实现二叉树先序,中序,后序,层次遍历
  17. [Deepin 15] 编译安装 MySQL-5.6.35
  18. Apache Rewrite(大小写)
  19. Mysql数据库If语句的使用
  20. sencha touch 压缩js,css遇到的问题

热门文章

  1. Linux下复制文件
  2. tree与GridView交互
  3. MySQL中select、insert、update批量操作语句
  4. tp5.1中的容器和facade的实现
  5. python程序—士兵出击
  6. Selenium常见问题
  7. php-fpm开启慢查询日志
  8. WPF界面假死
  9. vue案例todolist备忘录
  10. AOP之配置文件实现