简单封装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中if语句的几种优化代码写法
Mar 12 Javascript
Js+Jq获取URL参数的集中方法示例代码
May 20 Javascript
Node.js的基本知识简单汇总
Sep 19 Javascript
JavaScript 控制字体大小设置的方法
Nov 23 Javascript
Google 爬虫如何抓取 JavaScript 的内容
Apr 07 Javascript
JavaScript实现图片切换效果
Aug 12 Javascript
JS常用的几种数组遍历方式以及性能分析对比实例详解
Apr 11 Javascript
零基础之Node.js搭建API服务器的详解
Mar 08 Javascript
vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)
May 10 Javascript
vue跳转页面的几种方法(推荐)
Mar 26 Javascript
JavaScript隐式类型转换代码实例
May 29 Javascript
js动态添加带圆圈序号列表的实例代码
Feb 18 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
建立动态的WML站点(三)
2006/10/09 PHP
使用PHP实现蜘蛛访问日志统计
2013/07/05 PHP
PHP中file_get_contents高?用法实例
2014/09/24 PHP
PHP实现获取域名的方法小结
2014/11/05 PHP
微信支付扫码支付php版
2016/07/22 PHP
thinkphp3.2实现在线留言提交验证码功能
2017/07/19 PHP
ThinkPHP5.0框架验证码功能实现方法【基于第三方扩展包】
2019/03/11 PHP
一个XML格式数据转换为图表的例子
2010/02/09 Javascript
jquery 清空file域示例(兼容个浏览器)
2013/10/11 Javascript
javascript的渐进增强与平稳退化浅谈
2013/11/12 Javascript
javascript使用switch case实现动态改变超级链接文字及地址
2014/12/16 Javascript
Jqgrid之强大的表格插件应用
2015/12/02 Javascript
浅谈时钟的生成(js手写简洁代码)
2016/08/20 Javascript
解决vue 给window添加和移除resize事件遇到的坑
2020/07/21 Javascript
在elementui中Notification组件添加点击事件实例
2020/11/11 Javascript
[03:56]DOTA2完美大师赛趣味视频之小鸽子和Mineski打台球
2017/11/24 DOTA
[52:32]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第三场 11.18
2020/11/18 DOTA
Python ljust rjust center输出
2008/09/06 Python
python编写简易聊天室实现局域网内聊天功能
2018/07/28 Python
深入浅析Python中list的复制及深拷贝与浅拷贝
2018/09/03 Python
PyQt5实现五子棋游戏(人机对弈)
2020/03/24 Python
Python生成MD5值的两种方法实例分析
2019/04/26 Python
python对文件目录的操作方法实例总结
2019/06/24 Python
python利用tkinter实现屏保
2019/07/30 Python
解决django FileFIELD的编码问题
2020/03/30 Python
浅谈pytorch中torch.max和F.softmax函数的维度解释
2020/06/28 Python
纯CSS3实现表单验证效果(非常不错)
2017/01/18 HTML / CSS
美国一家专业的太阳镜网上零售商:Solstice太阳镜
2016/07/25 全球购物
HomeAway的巴西品牌:Alugue Temporada
2018/04/10 全球购物
哄娃神器4moms商店:美国婴童用品品牌
2019/03/07 全球购物
XD健身器材:Kevlar球、Crossfit健身球
2019/03/26 全球购物
购买原创艺术品:Zatista
2019/11/09 全球购物
生产部主管岗位职责
2014/01/06 职场文书
《蓝色的树叶》教学反思
2014/02/24 职场文书
医院我们的节日活动实施方案
2014/08/22 职场文书
pytorch 使用半精度模型部署的操作
2021/05/24 Python