浅析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的事件和方法有新的认识

赞 (0)

相关推荐

  • javascript的onchange事件与jQuery的change()方法比较

    改变一下思路变成键盘按键事件,如下: <asp:TextBox ID="txtName" runat="server" onkeyup="fNameChange();"></asp:TextBox> 这里有一点毛病是,你复制粘贴的内容,无法触发这个事件.下面是相关的一些代码: 复制代码 代码如下: function fNameChange(){ if($('#txtName').val().length<6){ jQ

  • JavaScript控制各种浏览器全屏模式的方法、属性和事件介绍

    复制代码 代码如下: // 判断各种浏览器,找到正确的方法function launchFullscreen(element) {  if(element.requestFullscreen) {    element.requestFullscreen();  } else if(element.mozRequestFullScreen) {    element.mozRequestFullScreen();  } else if(element.webkitRequestFullscree

  • JavaScript window.document的属性、方法和事件小结

    javascript中window.document的属性.方法和事件的总结,有需要的朋友可参考一下本文章. 属性: Attributes 存储节点的属性列表(只读) childNodes 存储节点的子节点列表(只读) dataType 返回此节点的数据类型 Definition 以DTD或XML模式给出的节点的定义(只读) Doctype 指定文档类型节点(只读) documentElement 返回文档的根元素(可读写) firstChild 返回当前节点的第一个子节点(只读) Implem

  • javascript中onmouse事件在div中失效问题的解决方法

    也就是说,移到对象的子对象上,也算onmouseout了.但这往往会达不到我们想要的预期效果.这是由于javascript自身的冒泡特性导致的(即在子元素上触发了事件,并冒泡到了父元素-堆栈后进先出算法).今天在网上搜了一下,找了以下的解决办法(兼容IE和Firefox). 在IE下解决问题很简单,用onMouseEnter.onMouseLeave来代替onMouseOver.onMouseOut就行了,他们的作用基本相同,但前者不会发生冒泡(如果用 jQuery的event事件,只要绑定mo

  • javascript下给元素添加事件的方法与代码

    最简单的是这样: <input type="button" onclick="alert(this.value)" value="我是 button" /> 动态添加onclick事件: <input type="button" value="我是 button" id="bu"> <script type="text/javascript&quo

  • JavaScript调用Activex控件的事件的实现方法

    书写成这样: <SCRIPT type="text/javascript" FOR="activexID" EVENT="onXXXevent()" > // js 处理具体内容. </SCRIPT> 当acitveX控件 onXXXevent()事件被触发时,调用此方法. 如果一个半个的话还好说,几十个这样的函数,把我的页面占据的满满的.况且在VS2008中,"设置选定内容格式化"总是提示:"

  • 浅析JavaScript事件和方法

    浅析JavaScript事件和方法

    单击一个超链接触发事件 1.用a标签的onclick <a href="#" onclick="js代码"> 这种写法呢,存在一种弊端,就是点击后会刷新一次页面,回到页面顶端. 想不刷新如何做的呢? 复制代码 代码如下: <a href="javascript:void(0)" onclick="js代码"> 2.#与javascript:void(0)的区别 超链接为"死链"时,使

  • 浅析Javascript中bind()方法的使用与实现

    在讨论bind()方法之前我们先来看一道题目: var altwrite = document.write;  altwrite("hello");  //1.以上代码有什么问题 //2.正确操作是怎样的 //3.bind()方法怎么实现 对于上面这道题目,答案并不是太难,主要考点就是this指向的问题,altwrite()函数改变this的指向global或window对象,导致执行时提示非法调用异常,正确的方案就是使用bind()方法: altwrite.bind(document

  • 浅析JavaScript中的事件委托机制跟深浅拷贝

    浅析JavaScript中的事件委托机制跟深浅拷贝

    今天聊下JavaScript中的事件委托跟深浅拷贝 一.事件委托 首先呢,介绍一下事件绑定 //方法一:通过onclick <button onclick="clickEvent()">点击</button> <script> function clickEvent(){ alert("点击事件"); } </script> //方法二:通过addEventListener <button id="bt

  • javascript处理a标签超链接默认事件的方法

    本文实例讲述了javascript处理a标签超链接默认事件的方法.分享给大家供大家参考.具体分析如下: 有时需要在a标签上添加click事件,并且跳转前处理一些事务,故需要做一些处理:通常前端会给出一个<a href="#">link</a>来代表这个行为,有些还会这样写<a href="###">link</a>或者<a href="javascript:void(0);">link&

  • javascript事件冒泡详解和捕获、阻止方法

    一.事件的发生顺序 这个问题的起源非常简单,假设你在一个元素中又嵌套了另一个元素 复制代码 代码如下: ----------------------------------- | element1                        | |   -------------------------     | |   |element2               |     | |   -------------------------     | |                 

  • 浅析jQuery事件之on()方法绑定多个选择器,多个事件

    $(document).on('click', '#header .top, #main .btn', function () { // code... }); on()方法绑定多个事件 $("table.planning_grid").on({ mouseenter: function() { // Handle mouseenter... }, mouseleave: function() { // Handle mouseleave... }, click: function()

  • JavaScript事件方法(实例讲解)

    废话不多说,直接上代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style type="text

  • JavaScript实现添加及删除事件的方法小结

    本文实例总结了JavaScript实现添加及删除事件的方法.分享给大家供大家参考.具体如下: JavaScript添加.删除事件的方法,也就是让某些方法生效指定次数,可以是一次.两次或更多次,但指定次数执行完毕后就删除该方法,使其失效,如果你经常从事JS编程,你就会知道这种功能用得比较多. 先来看看一个比较简单的例子: function $(id) { return document.getElementByIdx_x(id); } var ev = null; var count1 = 0;

  • javaScript事件学习小结（四）event的公共成员（属性和方法）

    javaScript事件学习小结（四）event的公共成员（属性和方法）

    相关阅读: JavaScript事件学习小结(五)js中事件类型之鼠标事件 http://www.jb51.net/article/86259.htm JavaScript事件学习小结(一)事件流 http://www.jb51.net/article/86261.htm javaScript事件学习小结(四)event的公共成员(属性和方法) http://www.jb51.net/article/86262.htm JavaScript事件学习小结(二)js事件处理程序 http://www

  • JavaScript事件用法浅析

    本文实例讲述了JavaScript事件用法.分享给大家供大家参考,具体如下: JavaScript通过事件与HTML交互. 事件流 事件流规定了事件的触发规则和顺序.DOM2规定了事件流包括三个阶段:事件捕获 -> 目标触发除 -> 事件冒泡.DOM2规定在事件捕获阶段不应调用事件处理程序,不过各大浏览器都不鸟它.DOM2级的事件处理程序操作函数对:addEventListener和removeEventListener的第三个参数则把这种事变成了DIY,这是一种妥协,同时让初学者认为dom的

随机推荐