一个cssQuery对象 javascript脚本实现代码


Posted in Javascript onJuly 21, 2009
/** 
* @author Supersha 
* @QQ:770104121 
*/ 
var cssQuery = { 
//parent:用于存储当前节点的父节点的引用 
parent: document, 
select: function(selectorStr){ 
var selectors=selectorStr.split(" "); //分隔字符串 
for (var i = 0, len = selectors.length; i < len; i++) { 
var el = this.parent || document; //用于存储指定class属性的节点引用 
var val=this.replaceStr(selectors[i]); //代替掉"#"和"."点号,用于获取指定的ID的节点引用 
if (selectors.length == 1) { //如果只有一个参数 
if (!(/[#.]/g).test(selectors[i])) { //如果是HTML标签 
return document.getElementsByTagName(selectors[i]); 
} 
else { //如果是ID或者指定的class值 
//判断是ID还是class属性 
return (this.IDLabel(selectors[i])) ? this.$(val) : this.getElementsByClassName(document, "*", val); 
} 
} 
//如果达到selectorStr字符号中最后的那个ID或者class或者HTML标签 
else if(i == selectors.length-1){ 
if (!(/[#.]/g).test(selectors[i])) { //如果是HTML标签 
return el.getElementsByTagName(selectors[i]); 
} 
else { //如果是ID或者class属性 
return (this.IDLabel(selectors[i])) ? this.$(val) : this.getElementsByClassName(el,"*",val); 
} 
} 
else{ //如果存在两级以上的selectorStr,则存储当前节点的引用到parent属性中 
if (!(/[#.]/g).test(selectors[i])) { //如果是HTML标签 
this.parent = el.getElementsByTagName(selectors[i])[0]; 
} 
else { //如果是ID或者class属性 
this.parent = ((/#/gi).test(selectors[i])) ? this.$(val) : el; 
} 
} 
} 
}, 
$: function(id){ //用于得到指定ID的引用 
return document.getElementById(id); 
}, 
IDLabel: function(selector){ //判断是否是ID属性 
return ((/#/gi).test(selector)) ? true : false; 
}, 
classLabel: function(selector){ //判断是否是class属性 
return ((/\./gi).test(selector)) ? true : false; 
}, 
replaceStr:function(a){ //替换掉"#"和"."点号,用于获取指定的ID的节点引用 
return a.replace("#","").replace(".",""); 
}, 
getElementsByClassName: function(el, tag, classname){ //通过class属性值获取含有class属性值的元素的引用 
var elem = el || document; 
if (!classname) 
return; 
tag = tag || "*"; 
var allTagsDom = ((tag == "*") && (elem.all)) ? elem.all : elem.getElementsByTagName(tag); 
classname = classname.replace(/\-/g, "\\-"); 
var regex = new RegExp("(^|\\s*)" + classname + "(\\s*|$)"); 
var matchElements = new Array(); 
var element; 
for (var i = 0; i < allTagsDom.length; i++) { 
element = allTagsDom[i]; 
if (regex.test(element.className)) { //根据正则来检测类名 
matchElements.push(element); 
} 
} 
return matchElements; 
} 
} 
//调用方法:cssQuery.select(selectorString); selectorString 像这种:"#p #b .em", 
//可以接收HTML标签和ID、class的组合,返回指定的selectorString的引用
Javascript 相关文章推荐
Domino中运用jQuery读取视图内容的方法
Oct 21 Javascript
JavaScript 判断判断某个对象是Object还是一个Array
Jan 28 Javascript
dess中一个简单的多路委托的实现
Jul 20 Javascript
关于JavaScript命名空间的一些心得
Jun 07 Javascript
javascript 操作符(~、&amp;、|、^、)使用案例
Dec 31 Javascript
Jquery实现动态切换图片的方法
May 18 Javascript
jQuery+css实现的切换图片功能代码
Jan 27 Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 Javascript
移动端使用localStorage缓存Js和css文的方法(web开发)
Sep 20 Javascript
微信小程序录音与播放录音功能
Dec 25 Javascript
vue裁切预览组件功能的实现步骤
May 04 Javascript
JavaScript简单实现关键字文本搜索高亮显示功能示例
Jul 25 Javascript
js计算页面刷新的次数
Jul 20 #Javascript
[原创]IE view-source 无法查看看源码 JavaScript看网页源码
Jul 19 #Javascript
Prototype Hash对象 学习
Jul 19 #Javascript
Prototype Array对象 学习
Jul 19 #Javascript
Prototype PeriodicalExecuter对象 学习
Jul 19 #Javascript
Prototype String对象 学习
Jul 19 #Javascript
Prototype Template对象 学习
Jul 19 #Javascript
You might like
推荐一篇入门级的Class文章
2007/03/19 PHP
Mysql中limit的用法方法详解与注意事项
2008/04/19 PHP
php笔记之:AOP的应用
2013/04/24 PHP
PHP实现今天是星期几的几种写法
2013/09/26 PHP
smarty模板引擎从php中获取数据的方法
2015/01/22 PHP
纯php生成随机密码
2015/10/30 PHP
smarty模板数学运算示例
2016/12/11 PHP
基于php双引号中访问数组元素报错的解决方法
2018/02/01 PHP
javascript 伪数组实现方法
2010/10/11 Javascript
Extjs NumberField后面加单位实现思路
2013/07/30 Javascript
JQUERY 设置SELECT选中项代码
2014/02/07 Javascript
JQuery异步加载无限下拉框级联功能实现示例
2014/02/19 Javascript
jquery查找父元素、子元素(个人经验总结)
2014/04/09 Javascript
knockoutjs模板实现树形结构列表
2017/07/31 Javascript
Easy UI动态树点击文字实现展开关闭功能
2017/09/30 Javascript
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
2018/09/20 Javascript
Vue中对拿到的数据进行A-Z排序的实例
2018/09/25 Javascript
js实现消灭星星(web简易版)
2020/03/24 Javascript
微信小程序文章列表功能完整实例
2020/06/03 Javascript
JavaScript获取时区实现过程解析
2020/09/24 Javascript
python登录pop3邮件服务器接收邮件的方法
2015/04/30 Python
python 拷贝特定后缀名文件,并保留原始目录结构的实例
2018/04/27 Python
Python实现滑动平均(Moving Average)的例子
2019/08/24 Python
解决python 上传图片限制格式问题
2019/10/30 Python
如何使用selenium和requests组合实现登录页面
2020/02/03 Python
python怎么删除缓存文件
2020/07/19 Python
无工作经验者个人求职信范文
2013/12/22 职场文书
大家检讨书5000字
2014/02/03 职场文书
药剂专业求职信
2014/06/20 职场文书
领导党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
2014年小学少先队工作总结
2014/12/18 职场文书
2015大学自主招生自荐信范文
2015/03/04 职场文书
法定代表人免职证明
2015/06/24 职场文书
创业计划书之青年旅馆
2019/09/23 职场文书
Python办公自动化之教你用Python批量识别发票并录入到Excel表格中
2021/06/26 Python
vue+elementUI实现表格列的显示与隐藏
2022/04/13 Vue.js