原生js封装dom操作库

【原生js封装dom操作库】的更多相关文章

原生js封装dom操作库

var utils = (function(window) { var flag = "getComputedStyle" in window; function win(attr, value) { if(typeof value !== "undefined") { document.documentElement[attr] = value; document.body[attr] = value; } return document.documentElem…

抛开jQuery，拾起原生JS的DOM操作

常用的JS-DOM操作与jQuery的对比 jQuery用多了,还是需要来熟练熟练原生JS的操作,不然写JS都快离不开jQuery了目录 1. 获取DOM 2. 创建DOM 3. 添加DOM 4. 删除DOM 5. 添加class 6. 是否存在class 7. 删除class 8. 实现 JQ 的toggleClass 9. 获取DOM的css样式 10. 给DOM设置css样式 11. 删除DOM的css样样式 12. DOM的查找(遍历),例如查找父级,子级,兄弟等节点 13. 获取DO…

原生js的dom操作

父节点parentNode 第一个子节点只会获取到元素节点 firstElementChild ★★★★★ 第一个子节点 (如果有文本节点将会获取到文本节点) firstChild 最后一个节点只会获取到元素节点 lastElementChild ★★★★★ 最后一个子节点 (如果有文本节点将会获取到文本节点) lastChild 当前节点的后一个(下一个)节点注:只会获取到元素节点(dom操作推荐使用这种方法,IE9测试兼容,IE8未测试) nextElement…

利用原生js的Dom操作实现简单的ToDoList的效果

效果如下: 前端及js代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ToDOList</title> <link rel="stylesheet" href="todolist.css"> </head> <body st…

整理一下原生js的dom操作

获取元素 getElementById() getElementsByClass() getElementsByTagName getElementsByName node属性前.后.父.子 previousSibling nextSibling parentNode childNode children firstChild lastChild 操作 appendChild insertBefore removeChild replaceChild innerHtml innerText 创…

js的dom操作（整理）（转）

js的dom操作整理(整理)(转) 一.总结一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来来更加方便的进行dom操作 1.dom是什么? 对于JavaScript,为了能够使JavaScript操作Html,JavaScript就有了一套自己的dom编程接口. 对于Html,dom使得html形成一棵dom树,类似于一颗家族树一样,一层接一层,子子孙孙. 2.Html的DOM树是什么? HTML中的每个标签元素,属性,文本都能看做是一个DOM的节点…

js的DOM操作整理（整理）

js的DOM操作整理(整理) 一.总结一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来更加方便的进行dom操作 1.dom是什么? 对于JavaScript,为了能够使JavaScript操作Html,JavaScript就有了一套自己的dom编程接口. 对于Html,dom使得html形成一棵dom树,类似于一颗家族树一样,一层接一层,子子孙孙. 2.Html的DOM树是什么? HTML中的每个标签元素,属性,文本都能看做是一个DOM的节点,这些d…

原生JS和jQuery操作DOM的区别小结

一.Js原生对象和jQuery实例对象的相互转化: (1).原生JS对象转JQ对象: $(DOM对象); (2). JQ对象转原生JS对象: $(DOM对象).get(index); //注意区分eq(index)是jQuery实例对象; 直接下标访问, $(DOM对象)[index]; 二.两者操作DOM的对比一.创建元素节点 1.1 原生JS创建元素/文本节点 document.createElement("p"); 1.2 jQuery创建元素/文本节点 $('<p>…

zBase --轻量级DOM操作库

项目地址:ZengTianShengZ-github zBase-1.2.0 --v3 修复部分bug,添加AMD规范测试 zBase-1.1.0 --v2 对 v1 版本做了升级,优化DOM查找,简化API,提高代码可读性,支持模块化支持 AMD & CommonJS zBase-1.0.0 --v1 没有任何依赖轻量级的Dom操作库,封装一些常用的css选择器和事件操作等 Quick start $ npm install $ gulp scripts 使用npm安装 zBase: $…

原生JS封装Ajax插件(同域&&jsonp跨域)

抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正确的地方,还望指正^_^ 一.Ajax核心,创建XHR对象 Ajax技术的核心是XMLHttpRequest对象(简称XHR),IE5是第一款引入XHR对象的浏览器,而IE5中的XHR对象是通过MSXML库中的一个ActiveX对象实现的,因此在IE中可能有3个版本,即MSXML2.XMLHttp.…