【JS学习笔记】函数传参

比如仅仅改变背景的颜色

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

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

<!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代表什么值。

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

时间: 2024-10-05 14:23:44

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

js最基础知识回顾2(函数传参,操作属性的第二种方式,提取行间事件,操作一组元素,this,焦点问题和鼠标按下抬起,选项卡)

一.函数传参     1.函数传参:参数就是占位符----函数里定不下来的东西 a. var a1=function(){ alert(123); }; function a(f){ // 相当于 f=a1 f(); }; a(a1); b.  function skip(skipPath){  //换肤 var oLink1 = document.getElementById('link1'); oLink1.href=skipPath; } c.   function setStyle(na

c# 通用类型系统 深拷贝 浅拷贝 函数传参

c# 通用类型系统 及变量在 深拷贝 浅拷贝 函数传参 中的深层次的表现 在编程中遇到了一些想不到的异常,跟踪发现,自己对于c#变量在内存上的表现理解有偏差,系统的学习并通过代码实验梳理了各种情况下,变量在内存级的表现情况,对以后的coding应该有些帮助.在此记录以免忘记了... 1. 通用类型系统 先来一张图: 通用数据类型分为了值类型和引用类型. 我们定义一个int型实际上是一个system.int32的实例,在语法上我们像使用其他的类对象一样,但是,存储的的仍然是基本类型.这种把基本类型

JS学习笔记-OO疑问之对象创建

问一.引入工厂,解决重复代码 前面已经提到,JS中创建对象的方法,不难发现,基本的创建方法中,创建一个对象还算简单,如果创建多个类似的对象的话就会产生大量重复的代码. 解决:工厂模式方法(添加一个专门创建对象的方法,传入参数避免重复) function createObject(name,age){ var obj =new Object(); //创建对象 obj.name = name; obj.age = age; obj.run = function(){ return this.nam

Vue.js学习笔记:在元素 和 template 中使用 v-if 指令

f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <script src="https://cdn.bootcss.com/vue/2.2.

[Pro Angular.JS]学习笔记1.1:设置开发环境

可以使用yeoman.io,很方便.我已经写了一篇随笔,介绍如何使用.这里也有一篇介绍的文章:http://www.cnblogs.com/JoannaQ/p/3756281.html 代码编辑器,在Mac下用了一下WebStorm,太恶心了.另外发现书的作者使用的开发环境是Windows + VS Express 2013,为了方便学习,我也使用VS Express 2013 Update2.VS2013用起来蛮舒服的,把WebStorm比得跟驼屎一样.也许是因为我没用习惯吧. 1.安装Nod

【转】Backbone.js学习笔记(二)细说MVC

文章转自: http://segmentfault.com/a/1190000002666658 对于初学backbone.js的同学可以先参考我这篇文章:Backbone.js学习笔记(一) Backbone源码结构 1: (function() { 2: Backbone.Events // 自定义事件 3: Backbone.Model // 模型构造函数和原型扩展 4: Backbone.Collection // 集合构造函数和原型扩展 5: Backbone.Router // 路由

函数传参,改变Div任意属性的值&amp;&amp;图片列表:鼠标移入/移出改变图片透明度

<!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-

Angular JS 学习笔记

特定领域语言 编译器:遍历DOM来查找和它相关的属性, 分为编译和链接两个阶段, 指令:当关联的HTML结构进入编译阶段时应该执行的操作,可以写在名称里,属性里,css类名里:本质上是函数 稳定的DOM:绑定了数据模型的DOM元素的实例不会在绑定的生命周期发生改变 作用域:用来检测模型的改变和为表达式提供执行上下文的 AngularJS 和其它模板系统不同,它使用的是DOM而不是字符串 指令: 由某个属性.元素名称.css类名出现而导致的行为,或者说是DOM的变化 Filter过滤器:扮演着数据

Node.js学习笔记(3) - 简单的curd

这个算是不算完结的完结吧,前段时间也是看了好久的Node相关的东西,总想着去整理一下,可是当时也没有时间: 现在看来在整理的话,就有些混乱,自己也懒了,就没在整理,只是简单的记录一下 一.demo的简单介绍 这次demo,只涉及到简单的curd操作,用到的数据库是mongo,所以要安装mongo数据库,数据库连接驱动是mongoose: 当然关于mongo的驱动有很多,比如mongous mongoskin等:(详见http://cnodejs.org/topic/4f4ca8e0940ce2e