chaihongjun.me

跨浏览器事件处理对象EventUtil

跨浏览器事件处理对象EventUtil

阅读(86)

在JavaScript中,DOM0级、DOM2级与旧版本IE(8-)为对象添加事件的方法不同,为了以跨浏览器的方式处理事件,需要编写一段“通用代码”,即跨浏览器的事件处理...

clientX,offsetX,screenX一张图即可弄懂

clientX,offsetX,screenX一张图即可弄懂

阅读(123)

从图中可以看出,无论是某某X还是某某Y都是相对鼠标点击的那个点。 screen显示器的意思,所以screenX和screenY则是鼠标点击位置相对距离显示器左边水平距...

【JS练习】滚动进度条

【JS练习】滚动进度条

阅读(170)

!DOCTYPEhtmlhtmlheadmetacharset=utf-8metahttp-equiv=X-UA-Compatiblecontent=IE=edge,chrome=1metaname=renderercontent=webkit!--somemetatags,importantforSEO--metaname=descriptioncontent=putashortdescripti...

【算法】javascript冒泡排序和快速排序

【算法】javascript冒泡排序和快速排序

阅读(183)

1.冒泡排序 相邻的两个元素比较,如果前面一个比后面的大,就交换一下位置。 functionbubbleSort(array){for(vari=0;iarray.length-1;i++){for(varj=0;jarray.length-1-i;j++){var...

JS在某个节点之后插入元素的封装函数

JS在某个节点之后插入元素的封装函数

阅读(157)

我们在日常进行DOM操作的时候,经常会使用到查找元素节点的父节点或者子节点及兄弟节点等。由于浏览器实现的效果差异,在IE老版本环境下,DOM操作查...

JS移除空白节点的封装函数

JS移除空白节点的封装函数

阅读(157)

我们在日常进行DOM操作的时候,经常会使用到查找元素节点的父节点或者子节点及兄弟节点等。由于浏览器实现的效果差异,在IE老版本环境下,DOM操作查...

[译文转载]原生JS DOM基本操作

[译文转载]原生JS DOM基本操作

阅读(65)

原文地址: https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/ 译文地址:https://dumengjie.github.io/2017/04/18/%E8%AF%91-%E5%8E%9F%E7%94%9FJS-DOM%E5%9F%BA%E6%9C%AC%E6%93%8...

JS事件捕获和冒泡Demo

JS事件捕获和冒泡Demo

阅读(139)

HTML: !DOCTYPEhtmlhtmlheadmetacharset=utf-8/titleJSBin/title/headbodydivclass=ulliClickonalayertowatchtheeventmovethroughtheDOMtree./li/ul/div/body/html CSS: *{box-sizing:border-box;margin:0;padding:20...

初级版通过class选择元素的函数

初级版通过class选择元素的函数

阅读(190)

我们经常遇到这样的一个应用场景,在一堆li里面选择出class具有某种特定值的元素集合,并且对选择出的元素集合做新的操作。 例如代码片段: ulid=list...

一段获取元素简单样式的函数代码

一段获取元素简单样式的函数代码

阅读(136)

...script//获取元素样式属性值functiongetStyle(obj,attr)//obj:元素对象,attr:元素的样式{if(obj.currentStyle)//针对IE{returnobj.currentStyle[attr];}else{returngetComputedStyle(obj,fa...