慕课网

第1章系好安全带,准备启航
编程：1-1 让你认识JS
编程：1-2 编程练习

第10章编程挑战
编程：10-1 编程挑战

解锁即可观看《前端工程师》完整课程视频

立即解锁

前端工程师

前端入门如同写字，如果你不知道从哪开始，那就选择前端（含Vue3.x，React17,TS）

【第1周】HTML5基础语法与标签

【第2周】CSS3基础语法与盒模型

【第3周】CSS3浮动定位与背景样式

【第4周】CSS3动画与穷游首页开发实战

【第5周】JS基础语法与表达式

【第6周】JS流程控制语句与数组

【第7周】JS函数与DOM

【第8周】面向对象

【第9周】项目实战：仿穷游JS特效开发

【第10周】ES6基础入门

【第11周】ES6语法扩展

【第12周】ES6之Promise与Class类

【第13周】ES6之Module模块与Babel编译

【第14-15周】HTTP 协议、存储、Ajax

【第16周】项目实战：仿穷游组件化开发

【第17周】移动基础

【第18周】移动进阶之高效开发

【第19周】项目实战：仿穷游移动webapp开发

【第20周】小程序基础与慕课小程序实战

【第21-22周】Sass基础与Vue.js基础语法

【第23周】项目实战：Vue.js仿京东到家电商全栈项目前端开发（上）

【第24-25周】项目实战：Vue.js仿京东到家电商全栈项目前端（下）

【第26周】全栈必备基础Node.js

【第27周】koa2中间件与MongoDB数据库

【第28-29周】项目实战：node.js仿京东到家电商全栈项目后端开发

【第30周】TypeScript与React.js基础语法

【第31-32周】React旅游网开发与工程化

【第33周】就业必备基础技术面试分析

【第34周】就业必备框架与全栈技术面试分析

插入节点appendChild()

在指定节点的最后一个子节点列表之后添加一个新的子节点。

语法:

appendChild(newnode)

参数:

newnode：指定追加的节点。

我们来看看，div标签内创建一个新的 P 标签，代码如下:

运行结果:

HTML
JavaScript
This is a new p

任务

试一试，完成为UL标签添加一个新项PHP。

1.在代码编辑器中，script标签内，为ul添加一个li。

2.设置li内容为PHP。

?不会了怎么办: <body>

<ul id="test">
<li>JavaScript</li>
<li>HTML</li>
</ul>

<script type="text/javascript">

var otest = document.getElementById("test");
var newnode = document.createElement("li");
var newtext= document.createTextNode("PHP");
newnode.appendChild(newtext);
otest.appendChild(newnode);

</script>

</body>

写笔记

公开笔记

提交

全屏

请验证，完成请求

由于请求次数过多，请先验证，完成再次请求

9-12 插入节点appendChild()

插入节点appendChild()

任务

写笔记

收藏课程后，能更快找到我哦～