javascript事件函数中获得事件源的两种不错方法

在javascript的事件响应中，许多情况我们需要获得事件源对象来对其属性进行更改，比如更改img的src属性。在事件响应函数中获得事件源的方法有如下两种：

第一种：

直接把作为一个参数传入。例如


代码如下:

<div id="myid" onclick="show(this);">text</div>

<script type="text/javascript">
function show(obj){
window.alert(obj.id);
}
</script>

第二种：

直接掉用隐藏的event对象。event对象有个srcElement属性，可以直接访问它


代码如下:

<div id="myid" onclick="show();">text</div>

<script type="text/javascript">
function show(){
window.alert(event.srcElement.id);
}
</script>

赞 (0)

相关推荐

  • JavaScript获得页面base标签中url的方法

    本文实例讲述了JavaScript获得页面base标签中url的方法.分享给大家供大家参考.具体如下: 如果网页中定义了base标签,我们可以通过js代码获得base的url地址 <!DOCTYPE html> <html> <head> <base id="htmldom" href="http://www.jb51.net/"> </head> <body> <p>Base UR

  • JavaScript中使用arguments获得函数传参个数实例

    JavaScript中使用arguments获得函数传参个数实例

    JS与PHP在函数传参方面有点不同,PHP形参与实参个数要匹配,而JS就灵活多了,可以随意传参,实参比形参少或多都不会报错. 实参比形参多不会报错 function say(a){    alert(a); }   say('琼台博客','WEB技术博客'); 执行结果 我们再来看看形参比实参多的结果 function say(a,b){    alert('a 的值是 '+a+'\nb 的值是 '+b); }   say('琼台博客'); 执行结果 a 对应第一个实参"琼台博客",b

  • javascript获得当前的信息的一些常用命令

    本文内容很简单,给大家总结一下javascript获得当前的信息的一些常用命令 console.info("document.URL=" + document.URL); console.info("document.location.href=" + document.location.href); //console.info("document.base=" + document.base); //这是错的! console.info(&q

  • 获得Javascript对象属性个数的示例代码

    如下所示: 复制代码 代码如下: //扩展对象的count方法Object.prototype.count = (    Object.prototype.hasOwnProperty('__count__')  ) ? function () {    return this.__count__;  } : function () {    var count = 0;    for (var i in this) if (this.hasOwnProperty(i)) {      coun

  • 使用JavaScript和C#中获得referer

    1. JavaScript 复制代码 代码如下: /**  * 获取HTTP请求的Referer  * @ishost 布尔类型 Referer为空时是否返回Host(网站首页地址)  */ function get_http_referer(ishost) {     if (ishost === undefined) { ishost = true; }     if (document.referrer) {         return document.referrer;     }

  • JavaScript获得url所有参数键值表的方法

    本文实例讲述了JavaScript获得url所有参数键值表的方法.分享给大家供大家参考.具体实现方法如下: function getUrlVars() { var vars = [], hash; var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); for (var i = 0; i < hashes.length; i++) { hash = hashes[i]

  • JavaScript获得表单target属性的方法

    本文实例讲述了JavaScript获得表单target属性的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html> <html> <body> <form id="frm1" action="form_action.asp" target="_blank"> First name: <input type="text" name="fnam

  • javascript事件函数中获得事件源的两种不错方法

    在javascript的事件响应中,许多情况我们需要获得事件源对象来对其属性进行更改,比如更改img的src属性.在事件响应函数中获得事件源的方法有如下两种: 第一种: 直接把作为一个参数传入.例如 复制代码 代码如下: <div id="myid" onclick="show(this);">text</div> <script type="text/javascript"> function show(ob

  • java 中ArrayList迭代的两种实现方法

    java 中ArrayList迭代的两种实现方法 Iterator与for语句的结合来实现,代码很简单,大家参考下. 实现代码: package cn.us; import java.util.ArrayList; import java.util.Iterator; //ArrayList迭代的两种方法 //Iterator与for语句的结合 public class Test1 { public static void main(String[] args) { ArrayList arra

  • JavaScript访问字符串中单个字符的两种方法

    概述 JavaScript是一门很灵活的语言,也提供了很多原生的函数供我们编程使用.这篇文章主要对javascript中如何访问字符串中的单个字符做一下介绍. javascript中一切皆为对象,要访问字符串中的单个字符主要有两种方法:数组索引和charAt()函数. 索引和charAt() 索引方式访问单个字符串 在javascript中,字符串可以被当做数组来处理,所以我们可以用数组下标的方式来访问单个字符.代码如下: 复制代码 代码如下: <script type="text/jav

  • JavaScript中子函数访问外部变量的3种解决方法

    JavaScript中子函数访问外部变量的3种解决方法

    前言 我们在写web页面时,肯定会经常遇到下面这种情况: <body> <div class="btns-wrapper"></div> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> var wrapper = $('.btns-wrapper'); fo

  • 前端开发过程中浏览器版本的两种判定方法

    在网上查找浏览器及版本判定方法有好多,此处小弟总结一二,以节省大家时间. 1.jquery的方法: 通过正则表达式可判定常用浏览器及其版本. 复制代码 代码如下: <span style="font-size:12px">function allinfo(){ var ua = navigator.userAgent; ua = ua.toLowerCase(); var match = /(webkit)[ \/]([\w.]+)/.exec(ua) || /(opera

  • C语言中十六进制转十进制两种实现方法

    C语言 · 十六进制转十进制 问题描述 从键盘输入一个不超过8位的正的十六进制数字符串,将它转换为正的十进制数后输出. 注:十六进制数中的10~15分别用大写的英文字母A.B.C.D.E.F表示. 样例输入 FFFF 样例输出 65535 思路:感觉自己的下面两个方法都对,但是···不说了[狡诈]... 方案一: #include<stdio.h> #include<math.h> #include<string.h> int main(){ char s[50]; s

  • Perl从文件中读取字符串的两种实现方法

    1. 一次性将文件中的所有内容读入一个数组中(该方法适合小文件): 复制代码 代码如下: open(FILE,"filename")||die"can not open the file: $!";@filelist=<FILE>; foreach $eachline (@filelist) {        chomp $eachline;}close FILE;@filelist=<FILE>; 当文件很大时,可能会出现"out

  • JavaScript中实现new的两种方式引发的探究

    JavaScript中实现new的两种方式引发的探究

    前言 当你 new 一个构造函数时发生了什么? "众所周知"的三步: 创建一个空对象,将它的引用赋给 this,继承函数的原型:通过 this 将属性和方法添加至这个对象:最后返回 this 指向的新对象,也就是实例. 一般来说在js中大概是这样的: function Mynew(parent,...rest){ let obj={}; obj.__proto__=parent.prototype; let res=parent.apply(obj,rest); return type

  • javascript匿名函数中的'return function()'作用

    我最近看到很多javascript代码,看起来我错了.在这种情况下,我应该建议哪种更好的代码模式?我将重现我所看到的代码和每个代码的简短说明: 代码块#1 该代码不应该评估内部函数.程序员会因为代码应该运行而感到困惑. $(document).ready( function() { return function() { /* NOPs */ } }); 代码块#2 程序员可能打算实现一个自调用功能.他们没有完全完成实现(他们在嵌套括号的末尾缺少一个().另外,由于它们在外部函数中没有做任何事情

  • 基于JS实现网页中的选项卡（两种方法）

    网页中经常会用到选项卡这种东东,说白了就是点击一个选项,下面会弹出这个选项里的内容. 方法一: 方法一利用简单的代码即可实现,以下是全部的代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>选项卡</title> <style type="text/css"> *{margin: 0;padding: 0;}

随机推荐