【js】--常用DOM库工具
/* 2014年3月16号 常用DOM工具库*/
var DOM={};
DOM.getElesByClass=function (strClassName,context){
if(typeof strClassName){
context=context||document;
if(context.nodeType==1||context.nodeType==9){
if(context.getElementsByClassName)
return context.getElementsByClassName(strClassName);
var reg=/^\s+|\s+$/g;
strClassName=strClassName.replace(reg,"");
var aClass=strClassName.split(/\s+/);
var eles=context.getElementsByTagName("*");
for(var i=0;i<aClass.length;i++){
eles=byClass(aClass[i],eles);
}
return eles;
}else{
throw new Error("第二个参数类型错误");
}
}else{
throw new Error("第一个参数必需是一个字符串");
}
function byClass(strClassName,eles){
var reg=new RegExp("(^| )"+strClassName+"( |$)");
//var eles=document.getElementsByTagName("*");
var a=[];//把找到的放到这个数组里
for(var i=0,len=eles.length;i<len;i++){
var ele=eles[i];
if(reg.test(ele.className)){//5
a.push(ele);
}
}
return a;
}
}
DOM.addClass=function(ele,strClassName){
var reg=new RegExp("(?:^| )"+strClassName+"(?: |$)");
if(!reg.test(ele.className))
ele.className+=" "+strClassName;
}
DOM.removeClass=function(){
var reg=new RegExp("(?:^| )"+strClassName+"(?: |$)","g");
ele.className=ele.className.replace(reg,"");
}
DOM.getIndex=function(ele){
var pre=ele.previousSibling;
var n=0;
while(pre){
if(pre.nodeType===1){
n++
}
pre=pre.previousSibling;
}
return n;
}
DOM.offset=function(ele){
var l=ele.offsetLeft;
var t=ele.offsetTop;
var p=ele.offsetParent;
while(p){
if(window.navigator.userAgent.indexOf("MSIE 8")>-1){
l+=p.offsetLeft;
t+=p.offsetTop;
}else{
l+=p.offsetLeft+p.clientLeft;
t+=p.offsetTop+p.clientTop;
}
p=p.offsetParent;
}
return {left:l,top:t}
}
DOM.getChildren=function(ele,tagName){//tagName用来指定标签名
ele.children//获得子元素
var nodes=ele.childNodes;
var a=[];
if(tagName===undefined){//如果没有传第二参数
for(var i=0,len=nodes.length;i<len;i++){
var node=nodes[i];
if(node.nodeType===1){
a.push(node);
}
}
}else{
if(typeof tagName=="string"){
tagName=tagName.toUpperCase();
for(var i=0,len=nodes.length;i<len;i++){
var node=nodes[i];
if(node.nodeName===tagName){
a.push(node)
}
}
}else{
throw new Error("第二个参数类型错误");
}
}
return a;
}
DOM.preSiblings=function(ele){
var p=ele.previousSibling;
var a=[];
while(p){
if(p.nodeType===1){
a.push(p);
}
p=p.previousSibling;
}
a.reverse();
return a;
}
DOM.nextSiblings=function(ele){
var n=ele.nextSibling;
var a=[];
while(n){
if(n.nodeType===1){
a.push(n);
}
n=n.nextSibling;
}
return a;
}
DOM.siblings=function(ele){
return DOM.preSiblings(ele).concat(DOM.nextSiblings(ele));
}
【js】--常用DOM库工具的更多相关文章
- 【js常用DOM方法】
介绍几个js DOM的常用方法 获取元素节点 getElementById getElementsByTagName getElementsByClassName 先写一个简单的网页做测试: /* ...
- js常用DOM操作
在博客园看到了苏夏写的常用DOM整理文章,地址:http://www.cnblogs.com/cabbagen/p/4579412.html,然后抽时间都试了一下这些常用的DOM操作.在这里记录一下. ...
- vue.js 常用组件库
vux github ui demo:https://github.com/airyland/vux Mint UI 项目主页:http://mint-ui.github.io/#!/zh-cndem ...
- js 常用 DOM 元素宽高
提示:document.documentElement 和 document.getElementsByTagName('html')[0] 是一样的: 1.视口大小(不包括滚动条,视口字面理解当然是 ...
- 爬虫05 /js加密/js逆向、常用抓包工具、移动端数据爬取
爬虫05 /js加密/js逆向.常用抓包工具.移动端数据爬取 目录 爬虫05 /js加密/js逆向.常用抓包工具.移动端数据爬取 1. js加密.js逆向:案例1 2. js加密.js逆向:案例2 3 ...
- js常用工具类.
一些js的工具类 复制代码 /** * Created by sevennight on 15-1-31. * js常用工具类 */ /** * 方法作用:[格式化时间] * 使用方法 * 示例: * ...
- Node.js 常用工具
Node.js 常用工具 util 是一个Node.js 核心模块,提供常用函数的集合,用于弥补核心JavaScript 的功能 过于精简的不足. util.inherits util.inherit ...
- js常用的工具函数
JS选取DOM元素的方法注意:原生JS选取DOM元素比使用jQuery类库选取要快很多1.通过ID选取元素document.getElementById('myid');2.通过CLASS选取元素do ...
- Node.js 常用工具util包
Node.js 常用工具 util 是一个Node.js 核心模块,提供常用函数的集合,用于弥补核心JavaScript 的功能 过于精简的不足. util.isError(obj); util.is ...
随机推荐
- B. Apple Tree 暴力 + 数学
http://codeforces.com/problemset/problem/348/B 注意到如果顶点的数值确定了,那么它分下去的个数也就确定了,那么可以暴力枚举顶点的数值. 顶点的数值是和LC ...
- 牛客网Java刷题知识点之什么是cookie、什么是session、cookie和session有什么区别
不多说,直接上干货! https://www.nowcoder.com/ta/review-java/review?tpId=31&tqId=21170&query=&asc= ...
- JS中数组的介绍
一.数组: 一组数据的集合: 二.JS中数组的特点: 1.数组定义时无需指定数据类型: 2.数组定义时可以无需指定数组长度: 3.数组可以存储任何类型的数据: 4.一般是相同的数据类型: 三.数组的创 ...
- arcgis jsapi接口入门系列(6):样式
symbol: function () { //线样式 //样式详情请看官方文档 let style = { //线颜色,支持多种格式: //CSS color string:例如"dodg ...
- Ubuntu 16.04 not a com32r image
安装Ubuntu16.04,出现题目中的错误,解决方法如下 重点:开机后按TAB键,在随后出现的命令行提示符中输入live 既可,之后的过程就是正常的过程了!
- QT如何设置应用程序的图标
QT如何设置应用程序的图标 准备:.ico格式的图片,可以选择任意其他图片格式的一张图片用格式工厂转换成.ico图片 例如选用的图片是Application.ico 把图片放到工程目录下 在工 ...
- JS 语言基础
两个变量 相加 var s="今天下雨了"; var i=10; alert(i+s); 这里的i+s是拼接的意思 显示出来是 今天下雨了10 假设我改 s="2 ...
- 什么是Java Marker Interface(标记接口)
先看看什么是标记接口?标记接口有时也叫标签接口(Tag interface),即接口不包含任何方法.在Java里很容易找到标记接口的例子,比如JDK里的Serializable接口就是一个标记接口. ...
- myeclipse报错MA
以下问题萌新问了我很多次了,无奈写个随笔.之后问的我都在这个随笔里补充. 断电/自动关机导致的问题: Could not open the editor: the file does not exis ...
- PHP高端课程
关于目后佐道IT教育 http://www.cnblogs.com/itpua/p/7710917.html 目后佐道IT教育的师资团队 http://www.cnblogs.com/itpua/p/ ...