[原创]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温习的一些笔记 基础常用知识小结
Jun 22 Javascript
javascript 使用 NodeList需要注意的问题
Mar 04 Javascript
浅谈JavaScript字符串拼接
Jun 25 Javascript
jquery事件的ready()方法使用详解
Nov 11 Javascript
JS延时提示框实现方法详解
Nov 26 Javascript
7个jQuery最佳实践
Jan 12 Javascript
微信小程序tabbar不显示解决办法
Jun 08 Javascript
微信小程序实现根据字母选择城市功能
Aug 16 Javascript
js操作二进制数据方法
Mar 03 Javascript
jQuery实现的电子时钟效果完整示例
Apr 28 jQuery
基于vue和react的spa进行按需加载的实现方法
Sep 29 Javascript
微信小程序实现左侧滑栏过程解析
Aug 26 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
mysql5写入和读出乱码解决
2006/11/25 PHP
一个用php实现的获取URL信息的类
2007/01/02 PHP
利用Ffmpeg获得flv视频缩略图和视频时间的代码
2011/09/15 PHP
PHP的几个常用加密函数
2016/02/03 PHP
Zend Framework教程之Zend_Db_Table用法详解
2016/03/21 PHP
thinkPHP5框架auth权限控制类与用法示例
2018/06/12 PHP
javascript vvorld 在线加密破解方法
2008/11/13 Javascript
jQuery+css+html实现页面遮罩弹出框
2013/03/21 Javascript
js函数获取html中className所在的内容并去除标签
2013/09/08 Javascript
简化版手机端照片预览组件
2015/04/13 Javascript
jquery实现的用户注册表单提示操作效果代码分享
2015/08/28 Javascript
JavaScript高仿支付宝倒计时页面及代码实现
2016/10/21 Javascript
基于Bootstrap仿淘宝分页控件实现代码
2016/11/07 Javascript
Bootstrap和Java分页实例第一篇
2016/12/23 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
2017/09/26 Javascript
axios中cookie跨域及相关配置示例详解
2017/12/20 Javascript
JS实现checkbox互斥(单选)功能示例
2019/05/04 Javascript
微信小程序class封装http代码实例
2019/08/24 Javascript
js实现简单的贪吃蛇游戏
2020/04/23 Javascript
JS数据类型判断的几种常用方法
2020/07/07 Javascript
python自然语言编码转换模块codecs介绍
2015/04/08 Python
人脸识别经典算法一 特征脸方法(Eigenface)
2018/03/13 Python
Python搭建HTTP服务过程图解
2019/12/14 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
POP文化和音乐灵感的时尚:Hot Topic
2019/06/19 全球购物
请解释接口的显式实现有什么意义
2012/05/26 面试题
山海经纬软件测试笔试题和面试题
2013/04/02 面试题
房地产员工找工作的自我评价
2013/11/15 职场文书
硕士研究生自我鉴定范文
2013/12/27 职场文书
回门宴答谢词
2014/01/13 职场文书
十岁生日家长答谢词
2014/01/17 职场文书
普宁寺导游词
2015/02/04 职场文书
酒店圣诞节活动总结
2015/05/06 职场文书
mysql 8.0.24 安装配置方法图文教程
2021/05/12 MySQL
详解Python中的for循环
2022/04/30 Python
Springboot集成kafka高级应用实战分享
2022/08/14 Java/Android