课程问题请教

老师请问，为什么要外链domReady.js，还有这个document.createDocumentFragment和document.createTextNode有什么区别和作用，听到这个阶段有点懵

qq_强强_6 2019-03-24

源自：JS DOM操作 6-2 create系列创建节点的方法

收起

2回答

好帮手慕夭夭回答被采纳获得+3积分 2019-03-25 13:59:49

你好同学 ,解答如下:

1.因为代码顺序执行 , 如果想视频中这样 ,把js写在html结构的上面 ,代码顺序执行 . 那么会先执行js然后执行html结构 .

一般js的内容是要在html结构加载完毕执行的 . domReady.js中是老师封装了一个myReady , 这个方法实际上实现的效果就是$(document).ready(function(){}) , 让DOM加载完后再去执行js代码 .

因为现在还没有学习到jQuery , 所以这里是老师为了方便课程讲解自己封装了一个类似的方法 . 这里同学对 domReady.js简单了解一下即可 .这个在以后学习了进阶里面的jQuery,使用$(document).ready(function(){}) 就可以啦 .

2.document.createTextNode是创建文本节点 ,参考如下:

document.createDocumentFragment你可以理解为创建了一个空盒子 , 假如像上面一样创建很多元素 ,那么使用appendChild一个一个把元素放在body里面有一点麻烦 ,所以这个时候可以先把它们放在盒子里面 ,然后直接把盒子加入到body里面 ,注意 ,盒子是虚拟的 ,它不会显示在body里面 ,只会把盒子里面的内容放在body里面 .例如如下:

不过这个在实际开发中是不常用的 ,同学简单了解会使用即可哦

祝学习愉快 ,望采纳 .

收起回答

qq_强强_6 提问者 #1

问题一已经理解了，问题为什么要放在一个盒子里呢，我直接吧P放在body里不是更方便吗？然后我用自己的思路写了一个代码发现不用这个空盒子加不进去 var txt = document.createTextNode("abc"); var ul = document.getElementById("ul"); var fragment = document.createDocumentFragment(); for (var i = 0; i < 20; i++) { var li = document.createElement("li"); li.appendChild(txt); ul.appendChild(li); }

2019-03-25 14:27:55
qq_强强_6 提问者 #2

DOM加载完是不是就是结构加载完的意思

2019-03-25 14:31:15

好帮手慕夭夭 2019-03-25 15:02:08

你好同学 ,这里没有说必须放在一个盒子里面 , 老师只是简单的举一个例子 ,来讲解它如何使用 . 你可以把很多元素放在一个盒子里面 ,然后把盒子里面的内容统一插入到body里面 , 或者直接把p插入到body里面也是没有问题的 . 代码是很灵活的 . 并且老师在上次回复中说过createDocumentFragment不是很常用 , 简单了解一下它的用法即可 .

DOM加载完是结构加载完的意思 , 这里理解的是对的哦.

祝学习愉快 ,望采纳 .

收起回答