[原创]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 相关文章推荐
C#中TrimStart,TrimEnd,Trim在javascript上的实现
Jan 17 Javascript
bootstrap3 兼容IE8浏览器!
May 02 Javascript
jQuery查找节点方法完整实例
Sep 13 Javascript
Bootstrap基本样式学习笔记之表单(3)
Dec 07 Javascript
微信小程序-拍照或选择图片并上传文件
Jan 06 Javascript
JS实现的简单图片切换功能示例【测试可用】
Feb 14 Javascript
seajs中最常用的7个功能、配置示例
Oct 10 Javascript
浅谈Vue SSR 的 Cookies 问题
Nov 20 Javascript
JS实现简单随机3D骰子
Oct 24 Javascript
用js编写留言板
Mar 17 Javascript
小程序Scroll-view上拉滚动刷新数据
Jun 21 Javascript
vue中watch的用法汇总
Dec 28 Vue.js
微信小程序  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/11/26 PHP
PHP处理Oracle的CLOB实例
2014/11/03 PHP
PHP防止刷新重复提交页面的示例代码
2015/11/11 PHP
php-fpm重启导致的程序执行中断问题详解
2019/04/29 PHP
jquery keypress,keyup,onpropertychange键盘事件
2010/06/25 Javascript
jquery与js函数冲突的两种解决方法
2013/09/09 Javascript
让新消息在网页标题闪烁提示的jQuery代码
2013/11/04 Javascript
Node.js中使用mongoskin操作mongoDB实例
2014/09/28 Javascript
JS+CSS实现的日本门户网站经典选项卡导航效果
2015/09/27 Javascript
jQuery移动web开发中的页面初始化与加载事件
2015/12/03 Javascript
jQuery禁用键盘后退屏蔽F5刷新及禁用右键单击
2016/01/22 Javascript
【经验总结】编写JavaScript代码时应遵循的14条规律
2016/06/20 Javascript
JavaScript实现二维坐标点排序效果
2017/07/18 Javascript
Node.JS 循环递归复制文件夹目录及其子文件夹下的所有文件
2017/09/18 Javascript
vue scroller返回页面记住滚动位置的实例代码
2018/01/29 Javascript
浅谈redux以及react-redux简单实现
2018/08/28 Javascript
JS端基于download.js实现图片、视频时直接下载而不是打开预览
2020/05/09 Javascript
[03:17]DOTA2英雄基础教程 剧毒术士
2013/12/12 DOTA
[01:14]3.19DOTA2发布会 三代刀塔人第二代
2014/03/25 DOTA
[04:11]DOTA2上海特级锦标赛主赛事首日TOP10
2016/03/03 DOTA
python 实现网上商城,转账,存取款等功能的信用卡系统
2016/07/15 Python
python判断字符串是否是json格式方法分享
2017/11/07 Python
使用anaconda的pip安装第三方python包的操作步骤
2018/06/11 Python
python实现ID3决策树算法
2018/08/29 Python
Python装饰器使用你可能不知道的几种姿势
2019/10/25 Python
python manage.py runserver流程解析
2019/11/08 Python
python通过移动端访问查看电脑界面
2020/01/06 Python
pycharm通过ssh连接远程服务器教程
2020/02/12 Python
详解tensorflow之过拟合问题实战
2020/11/01 Python
英国婴儿和儿童服装网站:Vertbaudet
2018/04/02 全球购物
业务经理岗位职责
2013/11/11 职场文书
教师远程培训感言
2014/03/06 职场文书
劲霸男装广告词改编版
2014/03/21 职场文书
纪律教育学习心得体会
2014/09/02 职场文书
2016年圣诞节寄语(一句话)
2015/12/07 职场文书
Zabbix6通过ODBC方式监控Oracle 19C的详细过程
2022/09/23 Servers