浅析JavaScript事件和方法

 更新时间:2015年02月28日 09:17:54   投稿:hebedich  
本文通过示例向大家简单分析了javascript的事件和方法,文章简洁而不简单,是篇非常不错的基础文章,这里推荐给大家。

单击一个超链接触发事件

1.用a标签的onclick

<a href="#" onclick="js代码">

这种写法呢,存在一种弊端,就是点击后会刷新一次页面,回到页面顶端。

想不刷新如何做的呢?

复制代码 代码如下:

<a href="javascript:void(0)" onclick="js代码">

2.#与javascript:void(0)的区别

超链接为“死链”时,使用#与javascript:void(0);的区别。

Void(0)没有用的值,不会去任何地方,就没有意义了

而#会刷新一次当前页面。

3.再或者、用a标签的href

<a href="javascript:  js代码   ">

只有超链接的href中的JavaScript中才需要加“javascript:”,

因为它不是事件,而是把”javascript:”看成像“http:”、“ftp:”、“thunder://”、“ed2k://”、“mailto:”一样的网络协议,交由js解析引擎处理。

方法的特别强调

1.不要另起一行

一般在js中编写大括号都是直接跟在后面而不要另起一行,

原因是js会在语句末尾自动增加”分号”,如果将大括号另起一行,则return语句后自动增加“分号”后,返回值就变成了undefined了。

2.不需要声明返回值类型

不需要声明返回值类型、参数类型。函数定义以function开头。

JavaScript中不像C#和java那样要求所有路径都有返回值没有返回值就是undefined。

3.没有方法重载

JavaScript中没有方法重载。

方法中写参数叫命名参数

用户调用计算多个数的和的方法,如何获取方法中有多少个参数呢?

请使用arguments对象!

匿名函数

1.方式一

复制代码 代码如下:

var f1=function(p1,p2){ return p1+p2; };//将函数赋值给一个变量

匿名函数没法调用,只能赋值给一个变量,由于是赋值语句,后面要加分号

应用:

复制代码 代码如下:

document.getElementById(‘btn').onclick=function(){}

2.方式二

复制代码 代码如下:

(function(p1,p2){alert(p1+p2);})(20,30);

3.方式三

复制代码 代码如下:

var m1=new Function(“p1”,”p2”,”p3”,”return p1+p2+p3”);
alert(m1(1,2,3));性能低

这种匿名函数的用法在jQuery中的非常多

扩展方法prototype

通过类对象的prototype设置扩展方法,

扩展方法的声明要在使用扩展方法之前执行。JS的函数没有专门的函数默认值的语法,但是可以不给参数传值,不传值的参数值就是undefined,自己做判断来给默认值。

复制代码 代码如下:

var msg ='xiaoming@111.com';
String.prototype.isEmail = function(){
return this.indexof('@')!= -1 ?true:false;
};
alert(msg.isEmail);

事件

1.调用事件

2.注册事件

一定是在页面加载完成了以后,才能给页面的元素注册事件。

所以 onload = function(){

     //在这里注册事件

};

页面加载事件

复制代码 代码如下:

  <script type="text/javascript">
       //刷新
       //location.reload();
          onload=function(){
           alert("页面加载了");
          };
          onunload =function(){
           alert("页面关闭了");
          };
          onbeforeunload= function(){
             alert("页面关闭之前触发");
          };
  </script>

以上就是本文的全部内容了,希望能够让大家对javascript的事件和方法有新的认识

相关文章

  • js+css3实现旋转效果

    js+css3实现旋转效果

    本文主要介绍了js+css3实现旋转效果的方法。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • 使用RN Animated做一个“添加购物车”动画的方法

    使用RN Animated做一个“添加购物车”动画的方法

    这篇文章主要介绍了使用RN Animated做一个“添加购物车”动画的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09
  • JS浏览器的首屏白屏时间计算示例详解

    JS浏览器的首屏白屏时间计算示例详解

    这篇文章主要为大家介绍了JS浏览器的首屏白屏时间计算示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-11-11
  • 使用js实现一个可编辑的select下拉列表

    使用js实现一个可编辑的select下拉列表

    这篇文章主要介绍了使用js实现一个可编辑的select下拉列表,个人感觉还不错,需要的朋友可以参考下
    2014-02-02
  • RGB颜色值转HTML十六进制(HEX)代码的JS函数

    RGB颜色值转HTML十六进制(HEX)代码的JS函数

    转到固定长度的十六进制字符串,不够则补0 javascript找出一个背景色的数值,只好自己解析
    2009-04-04
  • JavaScript 中对象的深拷贝

    JavaScript 中对象的深拷贝

    在JavaScript中,对对象进行拷贝的场景比较常见。但是简单的复制语句只能对对象进行浅拷贝,即复制的是一份引用,而不是它所引用的对象。而更多的时候,我们希望对对象进行深拷贝,避免原始对象被无意修改
    2016-12-12
  • 详解js location.href和window.open的几种用法和区别

    详解js location.href和window.open的几种用法和区别

    这篇文章主要介绍了详解js location.href和window.open的几种用法和区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-12-12
  • 浅析JS中常用类型转换及运算符表达式

    浅析JS中常用类型转换及运算符表达式

    这篇文章主要介绍了关于JS中涉及的常用类型转换及运算符表达式 ,包括js中常用类型转换,及常用的运算符表达式,需要的朋友可以参考下
    2017-07-07
  • js实现StringBuffer的简单实例

    js实现StringBuffer的简单实例

    下面小编就为大家带来一篇js实现StringBuffer的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • JavaScript使用canvas实现flappy bird全流程详解

    JavaScript使用canvas实现flappy bird全流程详解

    这篇文章主要介绍了JavaScript使用canvas实现flappy bird流程,canvas是HTML5提供的一种新标签,它可以支持JavaScript在上面绘画,控制每一个像素,它经常被用来制作小游戏,接下来我将用它来模仿制作一款叫flappy bird的小游戏
    2023-03-03

最新评论