if 函数的实现步骤:

  1. function +名字()
  2. 指定id , 指定开关(display: none or block)
  3. if + else 构成逻辑 控制开关

  1. 决定在哪里安置一个灯泡, 指定一个id给某个标签
  2. 把开关用电线连着灯泡, 安装开关
    #+id名称{ 属性1= 赋值, 属性 2 = 赋值 , 属性3 = 赋值 }

    所有的赋值都可以成为一个开关. 如果是一个手动版的, 这里已经完成了. 更改属性的赋值就可以变更id的样式
  3. 帮开关装上感应元件, 一旦有动静, 开关便自动switch     建立function showhide() { 使用if+else语句, 改变开关的接线:改变属性赋值 }
  4. 打开电制, 让开关通电.     事件动作接上函数

 

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

 

 

 

<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="显示隐藏" onclick="showHide()">
</input>

<div
id="div1">

JS之 if语句函数 对接事件动作 函数更改css css对接需要换妆的区id或class的更多相关文章

  1. 前端(十二)—— JavaScript基础操作:if语句、for循环、while循环、for...in、for...of、异常处理、函数、事件、JS选择器、JS操作页面样式

    JavaScript基础操作 一.分支结构 1.if语句 if 基础语法 if (条件表达式) { 代码块; } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通 ...

  2. 前端基本知识(四):JS的异步模式:1、回调函数;2、事件监听;3、观察者模式;4、promise对象

    JavaScript语言将任务的执行模式可以分成两种:同步(Synchronous)和异步(Asychronous). “同步模式”就是一个任务完成之后,后边跟着一个任务接着执行:程序的执行顺序和排列 ...

  3. js进阶 12-14 jquery的事件触发函数是哪两个

    js进阶 12-14 jquery的事件触发函数是哪两个 一.总结 一句话总结:trigger和triggerHandler 1.trigger传额外参数时候的注意事项是什么? 注意样例中是三个参数 ...

  4. js事件绑定函数

    js中事件绑定方法大致有三种: 1.在DOM元素中绑定 <input onclick="alert('在DOM中绑定')" type="button" v ...

  5. JS中事件绑定函数,事件捕获,事件冒泡

    1 事件绑定:事件与函数绑定以及怎么取消绑定 1.1 元素.onclick这种形式,如下: <div id="div1">aaa</div> <scr ...

  6. js立即执行函数应用--事件绑定

    js中立即执行函数的应用:应用到事件绑定上. 少说多做,直接运行代码(代码中有注释): <!DOCTYPE html> <html lang="zh"> & ...

  7. JS+Zero Clipboard swf复制到剪贴板 兼容浏览器(bind事件绑定函数)

    转自http://www.ipmtea.net/css_ie_firefox/201107/07_499.html 1.ZeroClipboard其实是国外的一个js类库,源码结构如: var Zer ...

  8. JS中函数与事件

    一.函数: 1.函数就是一个工具,通过一小段代码,完成某个功能: 2.函数的定义: function 函数名(){ ..... } 或者 : var 函数名 = function(){ ...... ...

  9. js进阶 14 jquery的ajax有哪些函数和事件(多练)

    js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...

随机推荐

  1. VUE 项目dependency was not found: * !!vue-style-loader!css-loader? 解决方案

    用npm run dev 运行vue项目时,出现以下错误: ERROR Failed to compile with errors :: This dependency was not found: ...

  2. 深入理解map系列--HashMap(一)

    Map系列之HashMap(源码基于java8) HashMap是我们最常用的map实现之一,这篇文章将会介绍HashMap内部是如何工作的,以及内部的数据结构是怎样的 一.数据结构简图 二.源码解析 ...

  3. [JZOJ6075]【GDOI2019模拟2019.3.20】桥【DP】【线段树】

    Description N,M<=100000,S,T<=1e9 Solution 首先可以感受一下,我们把街道看成一行,那么只有给出的2n个点的纵坐标是有用的,于是我们可以将坐标离散化至 ...

  4. 【GIS新探索】GeoHash原理和编解码实现

    1.什么是GeoHash geohash基本原理是将地球理解为一个二维平面,将平面递归分解成更小的子块,每个子块在一定经纬度范围内拥有相同的编码.不好理解,没关系,我来找个图. 就像上面这张图,一个坐 ...

  5. SpringSecurity自定义用户登录

    根据上一节的配置,默认在服务开启的时候会被要求自动的进行表单登陆.用到的用户名只能是一个固定的用户名user,它的密码是每次启动的时候服务器自动生成的.最常见的场景是我们的用户是从数据库中获取的. 1 ...

  6. php的session存放数组

    本文实例讲述了php使用session二维数组的用法 最普通的用法:一个变量名: $_SESSION['user'] = 0;echo $_SESSION['user']; 使用数组:代码如下: $_ ...

  7. [中英对照]How PCI Express Works | PCIe工作原理

    How PCI Express Works | PCIe工作原理 PCI Express is a high-speed serial connection that operates more li ...

  8. R语言 删除变量rm函数

    变量可以通过使用 rm()函数来删除.下面我们删除变量var.3.然后再打印变量时出现异常错误. rm(var.3) print(var.3) 当上面的代码执行时,它产生以下结果: [1] " ...

  9. ef——存储过程

      数据库中存在存储过程GetCategory: ALTER proc [dbo].[GetCategory] @cid int as begin select * from Categories w ...

  10. SQL SERVER学习2——数据库设计

    数据库设计是数据库知识中比较重要的部分,我们需要了解数据库设计的基本步骤,E-R图的画法. 数据库设计的基本概述 检验一个数据库设计好坏的标准就是,看他是否能够方便的执行各种数据检索和处理操作,并且有 ...