简单封装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 相关文章推荐
jquery win 7透明弹出层效果的简单代码
Aug 06 Javascript
jQuery 写的简单打字游戏可以提示正确和错误的次数
Jul 01 Javascript
JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果
Nov 26 Javascript
关于JS中的apply,call,bind的深入解析
Apr 05 Javascript
JavaScript常用字符串与数组扩展函数小结
Apr 24 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(放大缩小)
Dec 02 Javascript
vue通过路由实现页面刷新的方法
Jan 25 Javascript
详解es6超好用的语法糖Decorator
Aug 01 Javascript
vue移动端项目缓存问题实践记录
Oct 29 Javascript
vue.js表单验证插件(vee-validate)的使用教程详解
May 23 Javascript
vue项目使用.env文件配置全局环境变量的方法
Oct 24 Javascript
vue集成一个支持图片缩放拖拽的富文本编辑器
Jan 29 Vue.js
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
Protoss建筑一览
2020/03/14 星际争霸
PHP中array_merge和array相加的区别分析
2013/06/17 PHP
yii2 url重写并隐藏index.php方法
2018/12/10 PHP
用php定义一个数组最简单的方法
2019/10/04 PHP
jquery 分页控件实现代码
2009/11/30 Javascript
Js 冒泡事件阻止实现代码
2013/01/27 Javascript
可选择和输入的下拉列表框示例
2013/11/05 Javascript
jquery 删除cookie失效的解决方法
2013/11/12 Javascript
js实现固定显示区域内自动缩放图片的方法
2015/07/18 Javascript
JavaScript中的定时器之Item23的合理使用
2015/10/30 Javascript
js实现简单的二级联动效果
2017/03/09 Javascript
关于axios返回空对象的问题解决
2017/04/04 Javascript
vue项目实现记住密码到cookie功能示例(附源码)
2018/01/31 Javascript
vue将时间戳转换成自定义时间格式的方法
2018/03/02 Javascript
vue webpack实用技巧总结
2018/04/24 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
2019/09/16 Javascript
layer弹出层倒计时关闭的实现方法
2019/09/27 Javascript
vue中的过滤器及其时间格式化问题
2020/04/09 Javascript
python在windows下创建隐藏窗口子进程的方法
2015/06/04 Python
redis之django-redis的简单缓存使用
2018/06/07 Python
基于Python实现用户管理系统
2019/02/26 Python
Python爬虫学习之翻译小程序
2019/07/30 Python
Pytorch Tensor基本数学运算详解
2019/12/30 Python
python raise的基本使用
2020/09/10 Python
解决Python 写文件报错TypeError的问题
2020/10/23 Python
PyCharm+Miniconda3安装配置教程详解
2021/02/16 Python
Napapijri西班牙在线商店:夹克、外套、运动衫等
2020/11/05 全球购物
关于幼儿的自我评价
2013/12/18 职场文书
新浪微博实习心得体会
2014/01/27 职场文书
幼儿园教师教学反思
2014/02/06 职场文书
喷漆工的岗位职责
2014/03/17 职场文书
环保倡议书
2014/04/14 职场文书
初中班主任经验交流材料
2014/05/16 职场文书
不听老师话的万能检讨书
2014/10/04 职场文书
Python基础之pandas数据合并
2021/04/27 Python