[原创]javascript typeof id==='string'?document.getElementById(id):id解释


Posted in Javascript onNovember 02, 2016

一般来说想要理解这段代码,需要掌握如下两个函数

一个是 typeof 一个就是三元运算符

看完了上面的文章再看下面的就比较好理解了

一般来说常用的函数代码

function $(id){ return typeof id==='string'?document.getElementById(id):id;}
var GetBy = function (id) {
      return "string" == typeof id ? document.getElementById(id) : id;
    };

功能都是一样的。

这个函数的作用就是之后用到id选择器可以简写,至于判断的意义就是传入的参数为字符串就返回document.getElementById(id),其他的就返回参数本身,这个只是一个获取页面dom元素的一个简陋版本的函数,还不够完善。

1、这是一段JavaScript代码
$就是一个标示符。 也可以用getID等,如果你的页面中使用了jquery不建议使用$,因为jquery默认使用的就是$
?:是运算符
return "string" == typeof id ? document.getElementById(id) : id;
也可以写成是

if("string" == typeof id )
  return document.getElementById(id);
else
  return id;

有人感觉上面的代码,为什么不用{}括起来,因为代码比较短只有一行是不需要{}

如下所示

if("string" == typeof id )   {
  return document.getElementById(id);
  }
else {
  return id; 
   }

具体的可以参考这篇文章:https://3water.com/article/50197.htm

2、表达式1?表达式2:表达式3

这是一个式子;他的运算过程是:先计算表达式1,如果为true,这个式子就取表达式2的运算结果,否则整个式子取值就是表达式3的运算结果,不懂的朋友可以参考这篇文章:https://3water.com/article/64237.htm

在你这个例子中 表达式1是 "string" == typeof id,功能是判断id的数据类型是否为string ,==就是判断是否相等的运算符啊
表达式2是 document.getElementById(id) 获取ID为 参数id的值的html元素
表达式3 就是 id这个变量(一般来说这个变量多为object),如果是对象就不用document.getElementById了,直接就可以使用了。

三水点靠木原创整理,转载请注明出处

Javascript 相关文章推荐
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
Apr 27 Javascript
原生js实现改变随意改变div属性style的名称和值的结果
Sep 26 Javascript
jquery中ajax使用error调试错误的方法
Feb 08 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
Sep 17 Javascript
jQuery animate easing使用方法图文详解
Jun 17 Javascript
两种JavaScript的AES加密方式(可与Java相互加解密)
Aug 02 Javascript
angularjs 表单密码验证自定义指令实现代码
Oct 27 Javascript
ztree简介_动力节点Java学院整理
Jul 19 Javascript
JS使用setInterval实现的简单计时器功能示例
Apr 19 Javascript
jQuery实现网页拼图游戏
Apr 22 jQuery
react配置antd按需加载的使用
Feb 11 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
Oct 28 Javascript
微信小程序  audio音频播放详解及实例
Nov 02 #Javascript
微信小程序 vidao实现视频播放和弹幕的功能
Nov 02 #Javascript
bootstrap基础知识学习笔记
Nov 02 #Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
Nov 02 #Javascript
Bootstrap table的使用方法
Nov 02 #Javascript
AngularJS指令用法详解
Nov 02 #Javascript
AngularJS表单和输入验证实例
Nov 02 #Javascript
You might like
thinkphp实现数组分页示例
2014/04/13 PHP
PHP简单实现断点续传下载的方法
2015/09/25 PHP
PHP数组操作实例分析【添加,删除,计算,反转,排序,查找等】
2016/12/24 PHP
PHP分页显示的方法分析【附PHP通用分页类】
2018/05/10 PHP
javascript实现2048游戏示例
2014/05/04 Javascript
JavaScript事件委托技术实例分析
2015/02/06 Javascript
jQuery结合ajax实现动态加载文本内容
2015/05/19 Javascript
js实现的黑背景灰色二级导航菜单效果代码
2015/08/24 Javascript
jQuery Mobile动态刷新页面样式的实现方法
2016/05/28 Javascript
微信小程序 http请求详细介绍
2016/10/09 Javascript
jquery延迟对象解析
2016/10/26 Javascript
你不知道的 javascript【推荐】
2017/01/08 Javascript
jQuery监听浏览器窗口大小的变化实例
2017/02/07 Javascript
JS中去掉array中重复元素的方法
2017/05/26 Javascript
vue filters的使用详解
2018/06/11 Javascript
浅谈微信页面入口文件被缓存解决方案
2018/09/29 Javascript
jQuery开发仿QQ版音乐播放器
2020/07/10 jQuery
[06:53]DOTA2每周TOP10 精彩击杀集锦vol.3
2014/06/25 DOTA
python list排序的两种方法及实例讲解
2017/03/20 Python
python OpenCV学习笔记之绘制直方图的方法
2018/02/08 Python
Python 中Django安装和使用教程详解
2019/07/03 Python
python障碍式期权定价公式
2019/07/19 Python
Python使用Slider组件实现调整曲线参数功能示例
2019/09/06 Python
python实现单目标、多目标、多尺度、自定义特征的KCF跟踪算法(实例代码)
2020/01/08 Python
Python搭建Keras CNN模型破解网站验证码的实现
2020/04/07 Python
Python Selenium XPath根据文本内容查找元素的方法
2020/12/07 Python
世界上最大的在线学习和教学市场:Udemy
2017/11/08 全球购物
日本小田急百货官网:Odakyu
2018/07/19 全球购物
伊莱克斯阿根廷网上商店:Tienda Electrolux
2021/03/08 全球购物
卫校护理专业毕业生求职信
2013/11/26 职场文书
医药工作岗位求职信分享
2013/12/31 职场文书
元旦红领巾广播稿
2014/02/19 职场文书
辣妈辣妹观后感
2015/06/10 职场文书
500字作文之周记
2019/12/13 职场文书
MySQL 逻辑备份与恢复测试的相关总结
2021/05/14 MySQL
MySQL新手入门进阶语句汇总
2022/09/23 MySQL