1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3.  <head>
  4.   <title> New Document </title>
  5.   <meta name="Generator" content="EditPlus">
  6.   <meta name="Author" content="">
  7.   <meta name="Keywords" content="">
  8.   <meta name="Description" content="">
  9.  </head>
  10.  
  11.  <body>
  12.  
  13.   <button onclick="test()">Button</button>
  14.  
  15.   <script type="text/javascript">
  16.   var test = function()
  17.   {
  18.      document.write("javascript");
  19.   }
  20.   </script>
  21.  </body>
  22. </html>

点击按钮后就会显示javascript。这里设置了一个监听,点击onclick，会执行test的内容，但有一点应该知道，onclick的属性值并不是简单的函数名，而是可以放多条语句，以下写法也是正确的：

  1.   <button onclick="document.write('javascript');
  2.                    document.write('maybe');">Button</button>

点击后的结果为javascriptmaybe，所以千万不要误以为onclick的值是函数。

但是有的时候，我们onclick 和 script脚本写在html里，更改后的html如下：

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3.  <head>
  4.   <title> New Document </title>
  5.   <meta name="Generator" content="EditPlus">
  6.   <meta name="Author" content="">
  7.   <meta name="Keywords" content="">
  8.   <meta name="Description" content="">
  9.  </head>
  10.  
  11.  <body>
  12.   <button id="button1">Button</button>
  13.  
  14.   <script type="text/javascript" src="maybe.js">
  15.   </script>
  16.  </body>
  17. </html>

新建一个javascript文件，文件名为src属性的值maybe.js代码如下：

  1. var test = function ()
  2. {
  3. 	document.write("i am the one");
  4. };
  5.  
  6. document.getElementById("button1").onclick = test;

运行结果：i am the one。注意被document添加的相应只能是一个函数，所以等号右边是test，而不是test();如果写成test();我们还需要设置一个返回值，比如：

  1. var test = function ()
  2. {
  3. 	document.write("i am the one");
  4.  
  5. 	return function()
  6. 	{
  7. 		document.write("i am the two");
  8. 	}
  9. };
  10.  
  11. document.getElementById("button1").onclick = test();

执行过程如图所示：

i am the one的出现应该不难理解，因为test() 就代表了函数的执行。

javascript函数的基础功能的更多相关文章

  1. 100多个很有用的JavaScript函数以及基础写法大集合

    100多个很有用的JavaScript函数以及基础写法大集合 1.document.write("");为 输出语句2.JS中的注释为//3.传统的HTML文档顺序是:docume ...

  2. 让你的javascript函数拥有记忆功能，降低全局变量的使用

    考虑例如以下场景:假如我们须要在界面上画一个圆,初始的时候界面是空白的.当鼠标移动的时候,圆须要尾随鼠标移动.鼠标的当前位置就是圆心.我们的实现方案是:假设界面上还没有画圆,那么就新创建一个:假设已经 ...

  3. 常用Javascript函数与原型功能收藏

    // 重复字符串 String.prototype.repeat = function(n) { return new Array(n+1).join(this); } // 替换全部 String. ...

  4. javascript 函数的基础知识

    1. Why JavaScript functions always return a value? I'm taking a course in JavaScript programming, an ...

  5. javascript函数没有重载测试

    今天继续学习javascript系列教程,虽然是基础,但我觉得还是有必要用心来学习的,不要怕难,不用怕忘记,不要怕学不会.哪个高手不是从零开始的,我要坚定自己的学习信心,并且认真的走下去.虽然路途艰辛 ...

  6. JavaScript 函数基础

    1. JavaScript 函数基础 1. 定义方法 2. 函数的调用方法 3. 函数方法 apply : 将函数作为数组的方法来调用 将参数以数组形式传递给该方法 call   : 将函数作为对象的 ...

  7. javaScript系列 [01]-javaScript函数基础

    [01]-javaScript函数基础 1.1 函数的创建和结构 函数的定义:函数是JavaScript的基础模块单元,包含一组语句,用于代码复用.信息隐蔽和组合调用. 函数的创建:在javaScri ...

  8. 零基础讲解JavaScript函数

    一 JavaScript函数1 什么是函数  函数是一组代码(指令)的集合,通常用来完成某个单一的功能.(书的目录和章节,电视剧剧集的名称等)2 为什么要使用函数  2.1 把复杂程序划分成不同的功能 ...

  9. 基础的JavaScript函数

    基础的JavaScript函数 1.首字母大写 2.去除数组重复项 3.数组的排序 4.闭包 1. 把用户输入的不规范的英文名字,变为首字母大写,其他小写的规范名字(使用JavaScript的map函 ...

随机推荐

  1. DOS 根据用户输入执行指令判断IF

    @echo off set /p op="输入指令:" if "%op%" == "1" ( echo 你输入了指令1 ) if " ...

  2. jquery中的on事件

    on()函数用于为指定元素的一个或多个事件绑定事件处理函数. 从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind(). delegate(). l ...

  3. js关闭当前页面/关闭当前窗口/移动端 代码

    var userAgent = navigator.userAgent; if (userAgent.indexOf("Firefox") != -1 || userAgent.i ...

  4. 一分钟了解PHP

    PHP5编辑 PHP5在长时间的开发及多个预发布版本后,2004年7月13日,PHP5.0发布.该版本以Zend引擎Ⅱ为引擎,并且加入了新功能如PHP Data Objects(PDO).PHP5.0 ...

  5. 5款免费Windows远程连接Linux桌面软件（VNC客户端）

        不论我们出于何种的用途目的,很多朋友有需要用到VNC链接Linux桌面环境,之前老左有分享过VNC Viewer绿色软件,昨天有朋友提出来使用之后登录远程桌面的界面.分辨率等有些色差.流畅程度 ...

  6. 计算机图形学--旋转变换(java)

    import java.awt.Color; import java.awt.Frame; import java.awt.Graphics; import java.awt.event.Window ...

  7. Android技术宅：自制USB OTG数据线

    作为一名Android技术宅,USB OTG是你必须了解的,所谓USB OTG就是你可以利用手机或平板上用来充电.与电脑传输数据的micro USB接口来连接其他USB外设,如游戏手柄.鼠标.键盘.U ...

  8. Hessian Servlet和Hessian Spring的简单应用

    转自: http://lancui.iteye.com/blog/935578 简介 相比WebService,Hessian更简单.快捷.采用的是二进制RPC协议(Binary),因为采用的是二进制 ...

  9. javascript第十二课array数组

    数组的声明方式: var add=new array(元素1,元素2,元素3......); 推荐的数组声明方式: var add=[元素1,元素2,元素3,元素4....]; 数组遍历方式: 循环遍 ...

  10. Reward（拓扑结构+邻接表+队列）

    Reward Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 32768/32768K (Java/Other) Total Submis ...