Skylark.js知典 86:noder http://zhidian.wuute.com/skylarkjs/ 2026-05-20T16:09:08+09:00 Skylark.js知典 http://zhidian.wuute.com/skylarkjs/ http://zhidian.wuute.com/skylarkjs/lib/tpl/bootstrap3_1/images/favicon.ico text/html 2017-08-22T18:12:57+09:00 clone() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/clone?rev=1503393177&do=diff clone() 功能 创建指定的dom节点的副本。 语法 noder.clone(node,deep) 参数 * node HTMLElement对象，指定对象HTML元素节点 * deep 如果真通过了，就创建一个深层副本。 范例 Example: 点击按钮，data-deep=true,复制成功，否则不成功。 text/html 2017-08-22T18:14:09+09:00 contains() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/contains?rev=1503393249&do=diff contains() 功能 检查一个DOM节点是另一个DOM节点的后代。 语法 noder.contains(node,child) 参数 * node HTMLElement对象，指定对象HTML元素节点 * child 可以包含的DOM节点 范例 Example: 检测一个元素是否在另一个元素之内。 不支持文档和注释节点。 text/html 2017-08-22T18:14:45+09:00 contents() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/contents?rev=1503393285&do=diff contents() 功能 获得匹配元素集合中每个元素的子节点，包括文字和注释节点。 语法 noder.contents(elm) 参数 * elm HTMLElement对象，指定对象HTML元素 范例 Example: 第一个 div 下的 p 元素 复制添加到第二个 div 中。 text/html 2017-08-22T18:19:40+09:00 createElement() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/createelement?rev=1503393580&do=diff createElement() 功能 创建一个元素并在其上设置属性。 语法 noder.createElement(tag,props) 参数 * tag 用于创建元素的标记名称 * props 在新创建的元素上设置属性的对象哈希 范例 Example: 点击按钮添加文本为 world 的 p 元素在 div 元素中。 text/html 2017-08-22T18:20:40+09:00 createFragment() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/createfragment?rev=1503393640&do=diff createFragment() 功能 从HTML片段创建一个文档片段。 语法 noder.createFragment(html) 参数 * html html字符串 范例 Example: 点击按钮添加代码段<p>World!</p>。 <!DOCTYPE html> <html> <head> <style> div {border: 2px solid blue;} p { background: yellow;margin: 4px;} </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", … text/html 2017-08-22T18:22:26+09:00 createTextNode() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/createtextnode?rev=1503393746&do=diff createTextNode() 功能 创建一个新的文本节点。 语法 noder.createTextNode(text) 参数 * text 包含要放入文本节点的数据的字符串 范例 Example: 点击按钮添加节点文本“World”。 <!DOCTYPE html> <html> <head> <style> div {border: 2px solid blue;} p {background: yellow;margin: 4px;} </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", … text/html 2017-08-22T18:24:14+09:00 doc() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/doc?rev=1503393854&do=diff doc() 功能 获取当前文档对象。 语法 noder.doc() 范例 Example: 在页面文档中添加“<p>hello world!</p>“。 <!DOCTYPE html> <html> <head> <style> </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [ { name: "skylark", location: "../../../src/skylark" }, ] }); </script> </head> <body> <script> require(["skylark/query",… text/html 2017-08-22T18:25:10+09:00 empty() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/empty?rev=1503393910&do=diff empty() 功能 从DOM中删除指定节点的所有子节点。 语法 noder.empty(node) 参数 * node HTMLElement对象，指定对象HTML元素节点 范例 Example: 移除段落中的所有子节点包括文本。 <!DOCTYPE html> <html> <head> <style> p {background: yellow;} </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", location: "../../../src/skylark" },… text/html 2017-08-22T18:23:43+09:00 html() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/html?rev=1503393823&do=diff html() 功能 获取或设置指定元素的HTML内容。 语法 noder.html(node,html) 参数 * elm HTMLElement对象，指定对象HTML元素节点 * html 需设置的html内容 范例 Example: 为div设置一些内容。 <!DOCTYPE html> <html> <head> <style> .red { color:red; } </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", location: "../../../src/skylark" … text/html 2017-08-22T18:26:38+09:00 isChildOf() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/ischildof?rev=1503393998&do=diff isChildOf() 功能 检查dom节点是否为另一个dom节点的后代。 语法 noder.isChildOf(node, parent) 参数 * node HTMLElement对象，指定对象HTML元素节点 * parent 可能是容器的dom节点 范例 Example: 判断h4元素是否是div的子孙节点。 text/html 2017-08-22T18:27:13+09:00 isDoc() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/isdoc?rev=1503394033&do=diff isDoc() 功能 检查dom节点是否为文档。 语法 noder.isDoc(node) 参数 * node HTMLElement对象，指定对象HTML元素节点 范例 Example:判断元素 p 是否属于文档元素，alert结果。 <!DOCTYPE html> <html> <head> <style> </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", location: "../../../src/skylark" }, ] }); </script> <… text/html 2017-08-22T18:27:40+09:00 ownerDoc() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/ownerdoc?rev=1503394060&do=diff ownerDoc() 功能 获取指定元素的所有者文档对象。 语法 noder.ownerDoc(elm) 参数 * elm HTMLElement对象，指定对象HTML元素 范例 Example:查找p元素后再 ownerDoc body，修改body的背景色。 <!DOCTYPE html> <html> <head> <style> </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", location: "../../../src/skylark" }, ] }); … text/html 2018-01-25T13:00:22+09:00 placeAfter() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/placeafter?rev=1516852822&do=diff placeAfter() 功能 在指定的节点之后插入一个或多个节点。 语法 noder.placeAfter(node, placing, copyByClone) 参数 * node HTMLElement对象，指定对象HTML元素节点 * placing 插入一个或多个节点 * copyByClone text/html 2017-08-22T18:34:18+09:00 placeBefore() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/placebefore?rev=1503394458&do=diff placeBefore() 功能 在指定的节点之前插入一个或多个节点。 语法 noder.placeBefore(node, placing, copyByClone) 参数 * node HTMLElement对象，指定对象HTML元素节点 * placing 要插入一个或多个节点。 text/html 2017-08-22T18:36:38+09:00 placeChild() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/placechild?rev=1503394598&do=diff placeChild() 功能 插入一个或多个节点作为指定节点的最后一个子节点。 语法 noder.placeChild(node, placing, copyByClone) 参数 * node HTMLElement对象，指定对象HTML元素节点 * placing 要插入一个或多个节点 text/html 2017-08-22T18:35:29+09:00 placeChildFirst() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/placechildfirst?rev=1503394529&do=diff placeChildFirst() 功能 插入一个或多个节点作为指定节点的第一个子节点。 语法 noder.placeChildFirst(node, placing, copyByClone) 参数 * node HTMLElement对象，指定对象HTML元素节点 * placing 要插入一个或多个节点 text/html 2017-08-22T18:37:28+09:00 remove() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/remove?rev=1503394648&do=diff remove() 功能 将匹配元素集合从DOM中删除。 语法 noder.remove(node) 参数 * node HTMLElement对象，指定对象HTML元素节点 范例 Example: 将选中段落从DOM删除。 <!DOCTYPE html> <html> <head> <style> p { background:yellow; margin:6px 0; } </style> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script> <script> require.config({ baseUrl: "./", packages: [{ name: "skylark", location: "../../../src/skylark"… text/html 2017-08-22T18:38:18+09:00 replace() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/replace?rev=1503394698&do=diff replace() 功能 用指定的节点替换一个旧的节点。 语法 noder.replace(node, oldNode) 参数 * node HTMLElement对象，指定对象HTML元素替换节点 * oldNode 被替换的节点 范例 Example: 第一个p元素替换地三个p。 text/html 2017-08-22T18:51:39+09:00 noder http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/start?rev=1503395499&do=diff noder noder模块包含了许多与HTML结点增删移动等操作相关的工具函数。 模块函数 function noder() { } 成员列表 类型语法说明函数contents()获得匹配元素集合中每个元素的子节点，包括文字和注释节点。 text/html 2018-02-10T14:31:46+09:00 throb() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/throb?rev=1518240706&do=diff throb() 功能 在指定的元素中添加一个动画。 语法 noder.throb(elm, options) 参数 * elm HTMLElement对象，指定对象HTML元素 * options 一个对象包含了用于控制动画的params 范例 Example: 点击按钮，显示不同的效果。 text/html 2017-08-22T18:48:03+09:00 traverse() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/traverse?rev=1503395283&do=diff traverse() 功能 遍历指定的节点及其子节点，在每个节点上执行回调函数。 语法 noder.traverse(node,fun) 参数 * node HTMLElement对象，指定对象HTML元素节点 * fun 回调函数 范例 Example: 点击按钮 input 值增加。 text/html 2017-08-22T18:51:33+09:00 unwrap() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/unwrap?rev=1503395493&do=diff unwrap() 功能 从DOM中删除指定元素的父元素，将指定元素留在它们的位置。 语法 noder.unwrap(node) 参数 * node HTMLElement对象，指定对象HTML元素节点 范例 Example: 点击按钮，p 元素移出父级元素。 text/html 2017-08-22T18:49:55+09:00 wrapper() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/wrapper?rev=1503395395&do=diff wrapper() 功能 在指定的节点上包装一个HTML结构。 语法 noder.wrapper(node, wrapperNode) 参数 * node HTMLElement对象，指定对象HTML元素节点 * wrapperNode 要换行的节点。 范例 Example: 使用两种方式给 p 元素外包层 div。 text/html 2018-01-25T13:02:43+09:00 wrapperInner() http://zhidian.wuute.com/skylarkjs/doku.php/86/noder/wrapperinner?rev=1516852963&do=diff wrapperInner() 功能 在指定节点的内容外层包装一个节点。 语法 noder.wrapperInner(node,wrapperNode) 参数 * node HTMLElement对象，指定对象HTML元素节点 * wrapperNode 要换行的节点 范例 Example: 点击按钮给 div 元素外层加上 p 元素。