比如仅仅改变背景的颜色

　　函数传参：参数就是占位符。

　　那么在什么时候用传参呢？函数里定不下来的东西。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
    #div1{
        width:200px;
        height:200px;
        background:red;
        }
</style>
<script>
    function setColor(color)
    {
        var oDiv=document.getElementById('div1');
        oDiv.style.background=color;
        }
    /*function toGreen()
    {
        var oDiv=document.getElementById('div1');
        oDiv.style.background='green';
        }
    function toYellow()
    {
        var oDiv=document.getElementById('div1');
        oDiv.style.background='yellow';
        }
    function toBlack()
    {
        var oDiv=document.getElementById('div1');
        oDiv.style.background='black';
        }*/        
</script>
</head>

<body>
    <input type="button" value="变绿" onclick="setColor('green')"/>
    <input type="button" value="变黄" onclick="setColor('yellow')"/>
    <input type="button" value="变黑" onclick="setColor('black')"/>
    <div id="div1">
    </div>
</body>
</html>

比如改变Div的任意样式

　　操纵属性的第二种方式

　　那么在什么时候用呢？要修改的属性不固定。比如又要改宽度，又要改高度，又要改背景颜色，需要改的属性和其对应的值都不确定的时候。

　　字符串和变量——区别和关系

　　因此可以将属性名作为参数传递。

　　<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#div1
{
    width:200px;
    height:200px;
    background:red;
    }
</style>
<script>
function setStyle(name,value)
{
    var oDiv=document.getElementById('div1');
    oDiv.style[name]=value;
    }
</script>
</head>

<body>
<input type="button" value="变宽" onclick="setStyle('width','400px')"/>
<input type="button" value="变高" onclick="setStyle('height','400px')"/>
<input type="button" value="变绿" onclick="setStyle('background','green')"/>
<div id="div1">
</div>
</body>
</html>

　　字符串和变量——区别和关系

　　变量里面的值是可以改变的。

　　比如var a=5;alert(a);那么浏览器弹出来的就是5。如果a=12，那么浏览器弹出来的就是12。

　　而字符串的值是固定的。比如alert('abc');那么浏览器弹出来的就是abc。

　　CSS里面还有一种东西叫做字面量（常量），就是说你看到这个东西，自然就知道这个代表什么。比如12，就是数字12；比如'abc'，就是字母abc。

　　与字面量相对的就是变量。比如var a，a中的值是不固定的，仅仅只看a根本不知道a代表什么值。

　　因此写字符串时必须加''单引号，如果不加就会被认为是变量或者参数。

style与className

　　元素.style.属性=xxx 是修改行间样式

　　之后再修改className不会有效果。

　　因此，对于同一个元素，比如<div>,<span>，要么从头到尾操作的都是它的class，要么从头到尾只操作它的style，不要混着来。

【JS学习笔记】函数传参的更多相关文章

  1. js学习笔记5----函数传参

    构建函数的原则: 1) 尽量保持HTML结构一致: 2) 把核心主程序实现,用函数包起来: 3) 把每组里不同的值找出来,通过传参实现.

  2. JS中的函数传参

    前言: 函数分为有参有返回值,有参无返回值,无参无返回值,无参有返回值:那么对于无参数的函数你想使用函数的调用怎么办呢?如果你想封装一个代码,实现多种功能,但是形参大于实参或者实参大于形参又该如何?本 ...

  3. 看似无参却有参-----JS中的函数传参

    事件event JS的事件event是一个非常大的对象,不管是什么事件,事件的详情都会绑定到全局变量event中.这样做之所以安全,就是因为JS是单线程的. <html> <body ...

  4. js 变量以及函数传参

    一.变量: 基本类型是变量对象重新创建一个新值给变量对象空间,虽然是同一个值但是互不影响. 引用类型是也是将一个值重新赋值给新的变量空间,但是这个值是堆中对象的一个指针,新的变量和旧的变量指向是同一个 ...

  5. c# 内存的具体表现- 通用类型系统 深拷贝 浅拷贝 函数传参

    c# 通用类型系统 及变量在 深拷贝 浅拷贝 函数传参 中的深层次的表现 在编程中遇到了一些想不到的异常,跟踪发现,自己对于c#变量在内存上的表现理解有偏差,系统的学习并通过代码实验梳理了各种情况下, ...

  6. js学习笔记：webpack基础入门（一）

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  7. Vue.js学习笔记（2）vue-router

    vue中vue-router的使用:

  8. JS 学习笔记--9---变量-作用域-内存相关

    JS 中变量和其它语言中变量最大的区别就是,JS 是松散型语言,决定了它只是在某一个特定时间保存某一特定的值的一个名字而已.由于在定义变量的时候不需要显示规定必须保存某种类型的值,故变量的值以及保存的 ...

  9. WebGL three.js学习笔记 使用粒子系统模拟时空隧道（虫洞）

    WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...

随机推荐

  1. 转载：你需要知道的16个Linux服务器监控命令

    源址:http://web.itivy.com/article-653-1.html 如果你想知道你的服务器正在做干什么,你就需要了解一些基本的命令,一旦你精通了这些命令,那你就是一个 专业的 Lin ...

  2. TODOList项目

    [ 爱上Swift]十二期:TODOList项目   好久没有写Swift甚是想念,Swift,Xcode都比较稳定了写个程序熟悉一下,当然时间原因都是小Demo,废话不多说先上图. 下面是跑起来之后 ...

  3. OpenWrt的UCI系统

    http://wiki.openwrt.org/doc/uci UCI是Unified Configuration Interface的缩写,翻译成中文就是统一配置接口,用途就是为OpenWrt提供一 ...

  4. 清空SQL Server数据库中所有表数据的方法

    原文:清空SQL Server数据库中所有表数据的方法 其实删除数据库中数据的方法并不复杂,为什么我还要多此一举呢,一是我这里介绍的是删除数据库的所有数据,因为数据之间可能形成相互约束关系,删除操作可 ...

  5. Scala很难！

    Scala很难! 本文是从 Yes, Virginia, Scala is hard 这篇文章翻译而来. 首先要说的是,我是一个Scala粉丝,我作为一个Scala语言的倡导者差不多有5年历史了.我写 ...

  6. 我的Android 4 学习系列之文件、保存状态和首选项

    目录 使用Shared Preference 保留简单的应用程序数据 保存回话间的Activity实例数据 管理应用程序首选项和创建Preference Screen 保存并加载文件以及管理本地文件系 ...

  7. 值为NULL的对象指针

    相信大家对NULL不会很陌生,NULL 是一个标准规定的宏定义,用来表示空指针常量,当一个指针变量被赋值为NULL时,表示它不再指向任何有效地址,无法在访问任何数据.在VS2012库文件stdio.h ...

  8. Linux : fedora 安装 vnc server

    Linux配置VNC服务 安装VNC服务端 #yum install vnc-server 配置VNC服务参数文件 编辑vncservers文件追加如下 #vi /etc/sysconfig/vncs ...

  9. 园 首页 新随笔 联系 管理 订阅 订阅 RTSP协议转换RTMP直播协议

    RTSP协议转换RTMP直播协议 RTSP协议也是广泛使用的直播/点播流媒体协议,最近实现了一个RTSP协议转换RTMP直播协议的程序,为的是可以接收远端设备或服务器的多路RTSP直播数据,实时转换为 ...

  10. ArcGIS多面体（multipatch）解析（一）

    从几何学的角度来说,再复杂的三维形状都可以通过足够多,足够小的三角形组合起来表达.比如矩形可以表达成两个三角形,如下图: 圆柱形可以由多个三角形排列而成: 但ArcGIS中的多面体构成并没有采用这种“ ...