javascript 基础 onclick(this)用法介绍
http://www.5idev.com/p-javascript_events_onclick.shtml
------------------------------------------------------------------
直接这样调用 thiTest()的话, 里面的两个 this 都是 window 对象。
其实this.userName = 'outer userName'; 执行后,window.userName 被复制为 ‘outer userName’
function thisTest()
{
this.userName= 'outer userName';
function innerThisTest(){
var userName="inner userName";
alert(userName); //inner userName
alert(this.userName); //outer userName
}
return innerThisTest;
} thisTest()();
http://www.cnblogs.com/uedt/articles/1748422.html
理解这里的前提是你必须了解js里的原型概念(说道这里,kao,我还真的需要面壁一下):js中对象的prototype属性,是用来返回对象类型原型的引用的。所有js内部对象都有只读的prototype属性,可以向其原型中动态添加功能(属性和方法),
但该对象不能被赋予不同的原型。但是对于用户定义的对象可以被赋给新的原型。看个简单的示例
----------------------------------------------------
这是《DOM编程艺术》的一段代码:
<a href="images/fireworks.jpg" onclick="showPic(this)">Fireworks</a>
书上仅简单的说了一下在showPic(this)中,this代表a对象,但没有说为什么。
通俗来讲,this就是指调用者,谁调用它谁就是this,比如如果把onclick放入div,则div就是this:
<div onclick="showPic(this)">Fireworks</div> -----------------------------------------------------------------------------
<input id="btnTest" type="button" value="提交" /> <script type="text/javascript">
function thisTest(){
alert(this.value);
}
document.getElementById("btnTest").onclick=thisTest; //给button的onclick事件注册一个函数
</script>
-----------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(e){ ////e就是this, 点击事件 this指触发事件的对象
$('button').click(function(e){
alert(e.target.getAttribute('name'));
alert(e.target.name); // e.target 就是指出发事件的对象, 即 DOM 对象, button 对象
$('#w3s').attr('href', function(i, oldhref){
return i+oldhref;
});
})
});
</script>
</head>
<body>
<p><a href="http://www.w3school.com.cn" id="w3s">w3school.com.cn</a></p>
<button name="btn">改变 href 值</button>
<p>请把鼠标指针移动到链接上,或者点击该链接,来查看已经改变的 href 值。</p>
</body>
</html>
-------------------------------------------------void 操作符-----------------------
原文: http://www.cnblogs.com/uedt/articles/1748422.html
1、定义
javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值。
2、语法
void 操作符用法格式如下:
(1). javascript:void (expression)
(2). javascript:void expression
注意:expression是一个要计算的js标准的表达式。表达式外侧的圆括号是可选的,但是写上去你可以一眼就知道括弧内的是一个表达式(这和typeof后面的表达式语法是一样的)。
3、实例代码
function voidTest() { void (alert("it is a void test")); //执行函数 var oTestNum = 1;
void (oTestNum++); //整数自加
alert(oTestNum); oTestNum = 1;
void (oTestNum += " void test"); //整数加字符串
alert(oTestNum);
}
voidTest();
4、在a元素下使用void(0)
(1)适用情况
在网页中,我们经常看到html里的a标签不需要它导航到某一个页面时,href属性设置的写法:
<a href="#">link1</a>
<a href="javascript:void(0);">link2</a>
注意:第一种“#”的写法(其实#可以是多个,通常都是1个),当a元素所在的链接在浏览器一屏以下时,会导致页面回滚到顶部;所以当我们需要a标签不导航到其他页面,不需要网页位置的回滚,都会采取void(0)那种写法。
(2)ie6下void(0)造成的诡异问题
这个问题网上有很多讨论,个人认为“落叶满长沙”总结的很有代表性,这里就不再赘述了。
javascript 基础 onclick(this)用法介绍的更多相关文章
- javascript中onclick(this)用法介绍
this指触发事件的对象 代码如下: <input id="myinput" type="text" value="javascript中onc ...
- JavaScript基础入门08
目录 JavaScript 基础入门08 DOM 介绍 绑定事件 给一组元素绑定事件 节点 节点树 节点类型 选取文档内容 通过id选取元素 通过指定的标签名选取元素 用指定的css类来选取元素 通过 ...
- 第五模块·WEB开发基础-第2章JavaScript基础
第1章 JavaScript基础 01-JavaScript历史介绍 02-JavaScript的组成 03-JavaScript的引入方式 04-变量的使用 05-基本数据类型(一) 06-基本数据 ...
- 学习javascript基础知识系列第二节 - this用法
通过一段代码学习javascript基础知识系列 第二节 - this用法 this是面向对象语言中的一个重要概念,在JAVA,C#等大型语言中,this固定指向运行时的当前对象.但是在javascr ...
- 学习javascript基础知识系列第三节 - ()()用法
总目录:通过一段代码学习javascript基础知识系列 注意: 为了便于执行和演示,建议使用chrome浏览器,按F12,然后按Esc(或手动选择)打开console,在console进行执行和演示 ...
- 一步步学习javascript基础篇(3):Object、Function等引用类型
我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...
- JavaScript基础:DOM操作详解
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 JavaScript的组成 JavaScript基础分为三个部分: ...
- JavaScript基础三
1.10 关于DOM的事件操作 1.10.1 JavaScript的组成 JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准.包括变量.表达式.运算符.函数. ...
- JavaScript基础(2)-DOM
一.伪数组arguments arguments代表的是实参,有个讲究的地方是:arguments只在函数中使用. 1.返回函数实参的个数:arguments.length,例如: fn(2,4); ...
随机推荐
- Hadoop YARN ERROR 1/1 local-dirs are bad *, 1/1 log-dirs are bad *
转 http://blog.csdn.net/u012303571/article/details/46913471 查看 nodemanager 日志发下 如下信息 2015-07-16 1 ...
- 倒计时demo
#import <UIKit/UIKit.h> @interface ViewController : UIViewController @property (strong,nonatom ...
- 转: oracle 存储过程 执行动态 实现sql
http://jingyan.baidu.com/article/5d6edee2fbb9f999eadeecb9.html http://jingyan.baidu.com/article/3638 ...
- 【RMQ】 区间最值查询详解
1. 概述 RMQ(Range Minimum/Maximum Query),即区间最值查询,是指这样一个问题:对于长度为n的数列A,回答若干询问RMQ(A,i,j)(i,j<=n),返回数列A ...
- GDB: basics
Before Debugging, generating the debugging info using gcc -g3 *.c/cpp; then gdb ~.out/exe using comm ...
- 初识Selenium(三)
浅谈基于Selenium的Web自动化测试框架 发表于:2011-4-25 10:58 作者:邵育亮 来源:51Testing软件测试网原创 字体:大 中 小 | 上一篇 | 下一篇 | 打印 ...
- java 参数传值
基本数据类型参数的传值,参数为基本数据类型 class Computer{ int add(int x,int y){ return x+y; } } public class Example4_6 ...
- MYSQL数据库的套接字文件,pid文件,表结构文件
socket文件:当用Unix域套接字方式进行连接时需要的文件. pid文件:MySQL实例的进程ID文件. MySQL表结构文件:用来存放MySQL表结构定义文件. 套接字文件 Unix系统下本地连 ...
- protobuf与json互相转换
Java http://code.google.com/p/protobuf-java-format/ maven <dependency> <groupId>com.goog ...
- 高性能web开发:如何加载js,,js的存放位置
外部JS的阻塞下载 所有浏览器在下载JS的时候,会阻止一切其他活动,比如其他资源的下载,内容的呈现等等.至到JS下载.解析.执行完毕后才开始继续并行下载其他资源并呈现内容. 有人会问:为什么JS不能像 ...