使用原生js来操作对象dom的class属性

【使用原生js来操作对象dom的class属性】的更多相关文章

使用原生js来操作对象dom的class属性

之前一直都使用jquery来操作dom,今天想自己用原生写一些插件,却发现给dom增删class的时候,使用slice来截取className特别的麻烦,后来发现,原来原生JS本来就有提供api来对dom的class进行增删,下面的对象就是用来对dom进行增删class的. Element.classList 点击查看classlist的api html: <div class="container"> </div> <button class="…

原生Js监听普通dom尺寸变化

原生Js监听普通dom尺寸变化具体做法有以下几种: 初始化项目后,轮询,反复查看 dom 尺寸是否变化,这种一听就感觉不好,开销太大. 监听元素的滚动事件,在目标 dom 里面包裹一个同等大小的 div,是隐藏不可见的,当目标 dom 大小变化时,触发滚动事件.参考文章通过 MutationObserver 监听dom 节点变化,MutationObserver 是在DOM4规范中定义的,它的前身是 MutationEvent 事件,该事件最初在 DOM2 事件规范中介绍,到来了 DOM3…

JS（原生js和jq方式）获取元素属性（自定义属性），删除属性（自定义属性）

JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性) 以下内容: 一.获取元素的属性二.设置元素的属性三.删除元素的属性一.获取元素的属性 1-原生JS 获取属性 .getAttribute("属性") 2-jquery 获取属性 .attr("属性") 示例代码 /*jq获取属性*/ var temp = $('.test1').attr('class'); /*js获取属性*/ var temp = document.getElem…

原生JS：Array对象详解

Array对象本文参考MDN做的详细整理,方便大家参考[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects) 创建数组: 数组字面量:var arr1 = [1,2,3]; Array构造函数1:var arr2 = new Array(1,2,3); //[1,2,3] Array构造函数2:var arr3 = new Array(3); var arr3 = new…

原生JS：Object对象详细参考

Object对象详细参考本文参考MDN做的详细整理,方便大家参考MDN JavaScript原生提供一个Object对象(注意起首的O是大写),所有其他对象都继承自这个对象. 构造函数: Object 构造函数为给定的值创建一个对象包装. 如果给定值是 null or undefined,将会创建并返回一个空对象否则,将返回一个与给定值对应类型的对象. 当以非构造函数形式被调用时,Object() 等同于 new Object(). var o1 = new Object();//创建空对象…

原生JS：String对象详解

@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/css/cuteeditor.css); String对象本文参考MDN做的详细整理,方便大家参考[MDN](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript) JavaScript中的 String 类型用于表示文本型的数据. 它是由无符号整数…

原生JS一些操作

很久没写原生的JS了,上周做了一个小东西让我又重新了解了一下原生JS,以下记录一些常见的原生JS var canvArrow = document.getElementById('js-canv_arrow'); var body = document.getElementsByTagName('body')[0]; var a = document.getElementById('nav-text'); 1.修改css属性:canvArrow.style.display = "block&qu…