JS之if语句对接事件动作逻辑(详解)


Posted in Javascript onJune 28, 2017

if 函数的实现步骤:

function +名字()

指定id , 指定开关(display: none or block)

if + else 构成逻辑 控制开关

JS之if语句对接事件动作逻辑(详解)

决定在哪里安置一个灯泡, 指定一个id给某个标签

把开关用电线连着灯泡, 安装开关#+id名称{ 属性1= 赋值, 属性 2 = 赋值 , 属性3 = 赋值 }
所有的赋值都可以成为一个开关. 如果是一个手动版的, 这里已经完成了. 更改属性的赋值就可以变更id的样式

帮开关装上感应元件, 一旦有动静, 开关便自动switch 建立function showhide() { 使用if+else语句, 改变开关的接线:改变属性赋值}

打开电制, 让开关通电. 事件动作接上函数

最核心的原则就是, 事件动作对接函数, 函数对接属性(一个或多个)更改, 属性更改, 对接id或者class, id 或class对接事件动作所在标签

JS之if语句对接事件动作逻辑(详解)

<style>
#div1 {width:100px; height:200px; background:#CCC; display:none;}
</style>
<script>
function showHide()
{
  var oDiv=document.getElementById('div1');
  
  if(oDiv.style.display=='block')
  {
    oDiv.style.display='none';
  }
  else
  {
    oDiv.style.display='block';
  }
}
</script>
 
 
<input type="button" value="显示隐藏" oncpck="showHide()"> </input>
<div id="div1">

以上这篇JS之if语句对接事件动作逻辑(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
又一个图片自动缩小的JS代码
Mar 10 Javascript
面向对象Javascript核心支持代码分享
May 23 Javascript
js中的异常处理try...catch使用介绍
Sep 21 Javascript
jquery实现带缩略图的全屏图片画廊效果实例
Jun 25 Javascript
详解JavaScript基于面向对象之继承
Dec 13 Javascript
javascript cookie的简单应用
Feb 24 Javascript
Vue.js 表单校验插件
Aug 14 Javascript
关于Node.js的events.EventEmitter用法介绍
Apr 01 Javascript
vue-cli中打包图片路径错误的解决方法
Oct 26 Javascript
JavaScript设计模式之原型模式分析【ES5与ES6】
Jul 26 Javascript
小程序实现多选框功能
Oct 30 Javascript
基于vue hash模式微信分享#号的解决
Sep 07 Javascript
CSS3+JavaScript实现翻页幻灯片效果
Jun 28 #Javascript
Node.js 8 中的重要新特性
Jun 28 #Javascript
Angular排序实例详解
Jun 28 #Javascript
基于JS对象创建常用方式及原理分析
Jun 28 #Javascript
Node.js实现文件上传的示例
Jun 28 #Javascript
iscroll-probe实现下拉刷新和下拉加载效果
Jun 28 #Javascript
JavaScript 获取元素在父节点中的下标(推荐)
Jun 28 #Javascript
You might like
文章推荐系统(二)
2006/10/09 PHP
php4的彩蛋
2006/10/09 PHP
PHP使用DOMDocument类生成HTML实例(包含常见标签元素)
2014/06/25 PHP
Laravel框架路由配置总结、设置技巧大全
2014/09/03 PHP
PHP常用字符串操作函数实例总结(trim、nl2br、addcslashes、uudecode、md5等)
2016/01/09 PHP
基于PHP实现等比压缩图片大小
2016/03/04 PHP
PHP中如何判断exec函数执行成功?
2016/08/04 PHP
PHP+AJAX 投票器功能
2017/11/11 PHP
StringTemplate遇见jQuery冲突的解决方法
2011/09/22 Javascript
Jquery+asp.net后台数据传到前台js进行解析的方法
2014/05/11 Javascript
javaScript中with函数用法实例分析
2015/06/08 Javascript
Javascript日期格式化format函数的使用方法
2016/08/30 Javascript
基于jQuery实现Accordion手风琴自定义插件
2020/10/13 Javascript
JavaScript实现的拼图算法分析
2019/02/13 Javascript
JS实现横向轮播图(初级版)
2020/06/24 Javascript
Vue 请求传公共参数的操作
2020/07/31 Javascript
python使用mailbox打印电子邮件的方法
2015/04/30 Python
Python中基础的socket编程实战攻略
2016/06/01 Python
python对DICOM图像的读取方法详解
2017/07/17 Python
利用Python自带PIL库扩展图片大小给图片加文字描述的方法示例
2017/08/08 Python
Python内存管理方式和垃圾回收算法解析
2017/11/11 Python
python3调用R的示例代码
2018/02/23 Python
numpy使用fromstring创建矩阵的实例
2018/06/15 Python
python主线程捕获子线程的方法
2018/06/17 Python
Python+AutoIt实现界面工具开发过程详解
2019/08/07 Python
如何用python实现一个HTTP连接池
2021/01/14 Python
海淘零差价,宝贝全球购: 宝贝格子
2016/08/24 全球购物
CK巴西官方网站:Calvin Klein巴西
2019/07/19 全球购物
介绍一下Linux内核的排队自旋锁
2014/08/27 面试题
师范毕业生求职自荐信
2013/09/25 职场文书
公关活动策划方案
2014/05/25 职场文书
大学毕业生管理学求职信
2014/09/01 职场文书
感谢信格式范文
2015/01/22 职场文书
2015年小学英语教师工作总结
2015/05/12 职场文书
入党宣誓大会后的感想
2015/08/10 职场文书
nginx实现发布静态资源的方法
2021/03/31 Servers