前端开发知识点之javascript

mochixuan 发布于2019-08-21 17:07 / 2823人阅读

摘要：节点有一个属性用来表示当前元素的类型，它是一个整数，元素，属性，文本结构两个节点之间可能存在哪些关系以及如何在节点之间任意移动。

DOM manipulation

DOM节点（Node）通常对应于一个标签，一个文本，或者一个HTML属性。DOM节点有一个nodeType属性用来表示当前元素的类型，它是一个整数：

Element，元素

Attribute，属性

Text，文本

DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。

当前对象为node

返回父节点：node.parentNode, node.parendElement,

返回所有子节点：node.childNodes（包含文本节点及标签节点）,node.children

返回第一个子节点：node.firstChild

返回最后一个子节点： node.lastChild

返回同属上一个子节点：node.nextSibling

返回同属下一个子节点：node.previousSibling

parentNode和parentElement功能一样，childNodes和children功能一样。但是parentNode和childNodes是符合W3C标准的，可以说比较通用。而另外两个只是IE支持，不是标准，Firefox就不支持 ,所以大家只要记得有parentElement和children就行了
移位 -> http://www.cnblogs.com/QingFl...

DOM操作 ——如何添加、移除、移动、复制、创建和查找节点等。

// 添加、删除子元素

ele.appendChild(el);

ele.removeChild(el);

// 替换子元素

ele.replaceChild(el1, el2);

// 插入子元素

parentElement.insertBefore(newElement, referenceElement);

//克隆元素

ele.cloneNode(true) //该参数指示被复制的节点是否包括原节点的所有属性和子节点

childNodes vs children 返回所有子节点：

node.childNodes（包含文本节点及标签节点）,

node.children

Element.children returns only element children(元素节点), while Node.childNodes returns all node children. Note that elements are nodes, so both are available on elements.（node节点包括element 节点）

getElementsByClassName(H5) compatible version

function getElementsByClassName(node, classname) {
  if (node.getElementsByClassName) {
    return node.getElementsByClassName(classname);
  } else {
    var results = new Array();
    var elems = node.getElementsByTagName("*");
    for (var i = 0; i < elems.length; i++) {
      if (elems[i].className.indexOf(classname) != -1) {
        result.push(elems[i]);
      }
    }
    return results;
  }
}

GPU云服务器云服务器前端开发基础知识 javascript前端开发 javascript知识点前端知识

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/89149.html

Deep in JS - 收藏集 - 掘金

摘要：今天同学去面试，做了两道面试题全部做错了，发过来给道典型的面试题前端掘金在界中，开发人员的需求量一直居高不下。排序算法 -- JavaScript 标准参考教程（alpha） - 前端 - 掘金来自《JavaScript 标准参考教程（alpha）》，by 阮一峰目录冒泡排序简介算法实现选择排序简介算法实现 ... 图例详解那道 setTimeout 与循环闭包的经典面...

enali 2019-08-20 16:36 评论0 收藏0
2017 前端面试准备 - 收藏集 - 掘金

摘要：最近遇到的前端面试题更新版前端掘金个人博客已上线，欢迎前去访问评论无媛无故的个人博客以下内容非本人原创，是整理后觉得更容易理解的版本，欢迎补充。一道面试题引发的对 javascript 类型转换的思考 - 前端 - 掘金最近群里有人发了下面这题：实现一个函数，运算结果可以满足如下预期结果： ... 收集 JavaScript 各种疑难杂症的问题集锦 - 前端 - 掘金从原博客迁移...

王晗 2019-08-29 12:30 评论0 收藏0
2017 前端面试准备 - 收藏集 - 掘金

摘要：最近遇到的前端面试题更新版前端掘金个人博客已上线，欢迎前去访问评论无媛无故的个人博客以下内容非本人原创，是整理后觉得更容易理解的版本，欢迎补充。一道面试题引发的对 javascript 类型转换的思考 - 前端 - 掘金最近群里有人发了下面这题：实现一个函数，运算结果可以满足如下预期结果： ... 收集 JavaScript 各种疑难杂症的问题集锦 - 前端 - 掘金从原博客迁移...

xiaochao 2019-08-22 11:03 评论0 收藏0
2017 前端面试准备 - 收藏集 - 掘金

摘要：最近遇到的前端面试题更新版前端掘金个人博客已上线，欢迎前去访问评论无媛无故的个人博客以下内容非本人原创，是整理后觉得更容易理解的版本，欢迎补充。一道面试题引发的对 javascript 类型转换的思考 - 前端 - 掘金最近群里有人发了下面这题：实现一个函数，运算结果可以满足如下预期结果： ... 收集 JavaScript 各种疑难杂症的问题集锦 - 前端 - 掘金从原博客迁移过来...

KitorinZero 2019-08-20 16:40 评论0 收藏0
双十二大前端工程师读书清单

摘要：本文最早为双十一而作，原标题双大前端工程师读书清单，以付费的形式发布在上。发布完本次预告后，捕捉到了一个友善的吐槽读书清单也要收费。这本书便从的异步编程讲起，帮助我们设计快速响应的网络应用，而非简单的页面。本文最早为双十一而作，原标题双 11 大前端工程师读书清单，以付费的形式发布在 GitChat 上。发布之后在读者圈群聊中和读者进行了深入的交流，现免费分享到这里，不足之处欢迎指教...

happen 2019-08-02 16:00 评论0 收藏0
双十二大前端工程师读书清单

摘要：本文最早为双十一而作，原标题双大前端工程师读书清单，以付费的形式发布在上。发布完本次预告后，捕捉到了一个友善的吐槽读书清单也要收费。这本书便从的异步编程讲起，帮助我们设计快速响应的网络应用，而非简单的页面。本文最早为双十一而作，原标题双 11 大前端工程师读书清单，以付费的形式发布在 GitChat 上。发布之后在读者圈群聊中和读者进行了深入的交流，现免费分享到这里，不足之处欢迎指教...

余学文 2019-08-22 11:14 评论0 收藏0