[原创]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中for-in遍历方式示例介绍
Feb 11 Javascript
学习使用bootstrap3栅格系统
Apr 12 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
Jun 03 Javascript
Bootstrap基本组件学习笔记之进度条(15)
Dec 08 Javascript
前端构建工具之gulp的语法教程
Jun 12 Javascript
Node.js实现文件上传的示例
Jun 28 Javascript
JavaScript解析任意形式的json树型结构展示
Jul 23 Javascript
JS实现的找零张数最小问题示例
Nov 28 Javascript
vue项目中跳转到外部链接的实例讲解
Sep 20 Javascript
微信小程序实现留言板(Storage)
Nov 02 Javascript
vue路由切换之淡入淡出的简单实现
Oct 31 Javascript
在vue中嵌入外部网站的实现
Nov 13 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
php中{}大括号是什么意思
2013/12/01 PHP
PHP文件读写操作相关函数总结
2014/11/18 PHP
JScript中的undefined和"undefined"的区别
2007/03/08 Javascript
Javascript 个人笔记(没有整理,很乱)
2007/07/07 Javascript
jquery.combobox中文api和例子,修复了上面的小bug
2011/03/28 Javascript
使用js判断数组中是否包含某一元素(类似于php中的in_array())
2013/12/12 Javascript
深入探寻seajs的模块化与加载方式
2015/04/14 Javascript
JavaScript 封装一个tab效果源码分享
2015/09/15 Javascript
JavaScript 对象字面量讲解
2016/06/06 Javascript
JS实现数字格式千分位相互转换方法
2016/08/01 Javascript
js实现简单的计算器功能
2017/01/16 Javascript
bootstrap实现动态进度条效果
2017/03/08 Javascript
jQuery:unbind方法的使用详解
2017/08/14 jQuery
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
2017/10/19 jQuery
利用jQuery实现简单的拖曳效果实例代码
2017/10/20 jQuery
vue单页缓存方案分析及实现
2018/09/25 Javascript
微信小程序实现商品属性联动选择
2019/02/15 Javascript
详解ES6 Promise的生命周期和创建
2019/08/18 Javascript
超简单的微信小程序轮播图
2019/11/22 Javascript
Python字典的基本用法实例分析【创建、增加、获取、修改、删除】
2019/03/05 Python
Python with标签使用方法解析
2020/01/17 Python
Python计算指定日期是今年的第几天(三种方法)
2020/03/26 Python
python else语句在循环中的运用详解
2020/07/06 Python
PyCharm 解决找不到新打开项目的窗口问题
2021/01/15 Python
CSS3 transform的skew属性值图文详解
2014/07/21 HTML / CSS
IE浏览器单独写CSS样式的几种方法
2014/10/14 HTML / CSS
利用CSS3把图片变成灰色模式的实例代码
2016/09/06 HTML / CSS
美国睫毛、眉毛精华液领导品牌:RevitaLash Cosmetics
2018/03/26 全球购物
党的群众路线教育实践活动批评与自我批评
2014/02/16 职场文书
工作检讨书怎么写
2014/10/10 职场文书
乡镇计划生育工作汇报
2014/10/28 职场文书
乡镇2014法制宣传日活动总结
2014/11/01 职场文书
班委竞选稿范文
2015/11/21 职场文书
Python - 10行代码集2000张美女图
2021/05/23 Python
MySQL中order by的使用详情
2021/11/17 MySQL
springboot新建项目pom.xml文件第一行报错的解决
2022/01/18 Java/Android