摘要：它的作用是是用来处理等操作方法的参数的，统一将其处理为类型节点，并交由函数处理，即上图的。作用将返回的插入到的内部末尾。方法创建了一虚拟的节点对象，节点对象包含所有属性和方法。
前言：这篇我们倒着讲
1、有这样一个页面：
注意：不要 append(test1 )，规范写法是 append(test1
2、像之前的文章一样，我们自定义 append() 方法
let ajQuery={}
jQuery.each({
//例:"Test
"
//源码6011行-6019行
// 在被选元素的结尾插入指定内容
/*append的内部的原理，就是通过创建一个文档碎片，把新增的节点放到文档碎片中，通过文档碎片克隆到到页面上去，目的是效率更高*/
append: function(nodelist, arguments) {
//node是由domManip处理得到的文档碎片documentFragment，里面包含要插入的DOM节点
let callbackOne=function( node ) {
console.log(node,"node149")
//this指的就是$("xxx")
//1:元素节点,11:DocumentFragment,9:document
if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
//table插入tr的额外判断
//target默认情况是selector，即document.querySelectorAll(".inner")
let target = manipulationTarget( this, node )
console.log(target,node.childNodes,"node147")
//append的本质即使用原生appendChild方法在被选元素内部的结尾插入指定内容
target.appendChild( node );
}
}
console.log(nodelist,arguments,"this120")
return domManip( nodelist, arguments, callbackOne );
},
},
function(key, value) {
ajQuery[key] = function(nodelist, arguments) {
console.log(nodelist,"nodelist128")
return value(nodelist, arguments);
}
}
)
3、可以看到，append() 内部调用了 domManip 的方法，接下来重点介绍下该方法
（1）什么是 domManip ？
domManip() 是 jQuery DOM 的核心函数。dom 即 Dom 元素，Manip 是Manipulate 的缩写，连在一起就是 Dom 操作的意思。
（2）它的作用是？
domManip() 是用来处理 $().append(xxx)、$().after(xxx) 等操作 DOM 方法的参数的，统一将其处理为 DOM 类型节点，并交由 callback 函数处理，即上图的 callbackOne。
注意： 本文暂不考虑参数包含
14、本篇文章的所有代码
github：
https://github.com/AttackXiao...
代码：
jQuery的遍历结构设计之节点操作
（完）
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/103075.html
摘要：起初选择先看源码而不是的原因也简单作为每个前端会用的第一个框架，虽然过时，但却又如此普及，所以想看看它是咋设计的。 showImg(https://segmentfault.com/img/remote/1460000019663680); 起初选择先看jQuery源码而不是react的原因也简单：jQuery作为每个前端会用的第一个框架，虽然过时，但却又如此普及，所以想看看它是咋设计...
摘要：效果预览来自的效果预览引用了，已被墙，请谨慎预览转载声明这篇文章其实源自的博客。主要内容整个效果都建立在的里面。为了弥补这个缺陷，我决定改成在函数中对进行操作。重点来了，是和初始位置的相对位置。就是元素的初始值。 效果预览 来自codepen的效果预览：（引用了angularjs，已被墙，请谨慎预览）http://codepen.io/flybywind/pen/aNjxJa 转载声明...
摘要：效果预览来自的效果预览引用了，已被墙，请谨慎预览转载声明这篇文章其实源自的博客。主要内容整个效果都建立在的里面。为了弥补这个缺陷，我决定改成在函数中对进行操作。重点来了，是和初始位置的相对位置。就是元素的初始值。 效果预览 来自codepen的效果预览：（引用了angularjs，已被墙，请谨慎预览）http://codepen.io/flybywind/pen/aNjxJa 转载声明...
阅读 686·2019-08-30 15:54
阅读 3219·2019-08-29 15:33
阅读 2557·2019-08-29 13:48
阅读 961·2019-08-26 18:26
阅读 3242·2019-08-26 13:55
阅读 1296·2019-08-26 10:45
阅读 1046·2019-08-26 10:19
阅读 209·2019-08-26 10:16
