简单封装js的dom查询实例代码


Posted in Javascript onJuly 08, 2016

最近一直在啃犀牛书,有感,于是写了个简单的js的dom查询

$ = function (val) {
    switch(val.charAt(0)) {
      case '#' :
        return document.getElementById(val.substring(1));
        break;
      case '.' :
        val = val.replace('.','');
        if(document.getElementsByClassName)
          return document.getElementsByClassName(val);
        else {
          var obj = document.getElementsByTagName('*'),len = obj.length,arr=[];

          for(var i=0;i<len;i++) {
            if(obj[i].className == val) {
              arr[arr.length] = obj[i];
            }
          }

          return arr;
        }
        break;
      default :
        if(document.getElementsByName(val).length > 0)
          return document.getElementsByName(val);
        else 
          return document.getElementsByTagName(val); 
    }
  }

这样一实现,以后调用id时,只需 $('#idname'),class时$('.classname'),TagName和Name都是做了个简单的判断,都是直接传 $('name'),我试了下,感觉还可以。

以上这篇简单封装js的dom查询实例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js关于字符长度限制的问题示例探讨
Jan 24 Javascript
JavaScript中对象属性的添加和删除示例
May 12 Javascript
js数值计算时使用parseInt进行数据类型转换(jquery)
Oct 07 Javascript
input输入框鼠标焦点提示信息
Mar 17 Javascript
JavaScript数据类型详解
Apr 01 Javascript
深入浅析JavaScript中的arguments对象(强力推荐)
Jun 03 Javascript
基于JS组件实现拖动滑块验证功能(代码分享)
Nov 18 Javascript
js中apply()和call()的区别与用法实例分析
Aug 14 Javascript
微信小程序日历弹窗选择器代码实例
May 09 Javascript
jquery插件开发模式实例详解
Jul 20 jQuery
解决Vue 给mapState中定义的属性赋值报错的问题
Jun 22 Javascript
微信小程序地图实现展示线路
Jul 29 Javascript
JS选取DOM元素的简单方法
Jul 08 #Javascript
封装获取dom元素的简单实例
Jul 08 #Javascript
jquery.serialize() 函数语法及简单实例
Jul 08 #Javascript
详解BootStrap中Affix控件的使用及保持布局的美观的方法
Jul 08 #Javascript
Augularjs-起步详解
Jul 08 #Javascript
Bootstrap Metronic完全响应式管理模板之菜单栏学习笔记
Jul 08 #Javascript
Bootstrap Metronic完全响应式管理模板学习笔记
Jul 08 #Javascript
You might like
对盗链说再见...
2006/10/09 PHP
5.PHP的其他功能
2006/10/09 PHP
利用中国天气预报接口实现简单天气预报
2014/01/20 PHP
php两种无限分类方法实例
2015/04/21 PHP
深入浅析php json 格式控制
2015/12/24 PHP
来自chinaz的ajax获取评论代码
2008/05/03 Javascript
css把超出的部分显示为省略号的方法兼容火狐
2008/07/23 Javascript
jQuery EasyUI 中文API Layout(Tabs)
2010/04/27 Javascript
javascript中onmouse事件在div中失效问题的解决方法
2012/01/09 Javascript
用javascript判断IE版本号简单实用且向后兼容
2013/09/11 Javascript
js判断当页面无法回退时关闭网页否则就history.go(-1)
2014/08/07 Javascript
JavaScript 学习笔记之基础中的基础
2015/01/13 Javascript
高性能JavaScript模板引擎实现原理详解
2015/02/05 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
2016/09/04 Javascript
AngularJS中使用three.js的实例详解
2017/07/21 Javascript
JS实现点击复选框变更DIV显示状态的示例代码
2017/12/18 Javascript
Vue的轮播图组件实现方法
2018/03/03 Javascript
vue中实现图片和文件上传的示例代码
2018/03/16 Javascript
vue双向绑定数据限制长度的方法
2019/11/04 Javascript
js中switch语句的学习笔记
2020/03/25 Javascript
深入解析Python的Tornado框架中内置的模板引擎
2016/07/11 Python
python处理csv中的空值方法
2018/06/22 Python
Linux系统(CentOS)下python2.7.10安装
2018/09/26 Python
Python中出现IndentationError:unindent does not match any outer indentation level错误的解决方法
2020/04/18 Python
python Elasticsearch索引建立和数据的上传详解
2019/08/04 Python
pandas to_excel 添加颜色操作
2020/07/14 Python
python UDF 实现对csv批量md5加密操作
2021/01/01 Python
美国标志性加大尺码时装品牌:Ashley Stewart
2016/12/15 全球购物
FitFlop美国官网:英国符合人体工学的鞋类品牌
2018/10/05 全球购物
获取邓白氏信用报告:Dun & Bradstreet
2019/01/22 全球购物
社区母亲节活动方案
2014/03/05 职场文书
股权转让协议书
2014/04/12 职场文书
感恩老师演讲稿600字
2014/08/28 职场文书
个人作风纪律整顿整改措施
2014/10/25 职场文书
oracle数据库去除重复数据
2022/05/20 Oracle
Python中的 No Module named ***问题及解决
2022/07/23 Python