<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title></title>

         <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>

     </head>

     <body>

         <div id="n1">

             <div id="n2">

                 <span id="n3"></span>

                 <ul id="n4">

                     <p></p><p>p</p>

                     <li id="n5">item1</li>

                     <li id="n6">item2</li>

                     <li id="n7">item3</li>

                 </ul>

                 <span id="n8"></span>

             </div>

         </div>

         <script>

             // index() 中如果无参数，则返回li在同辈参数中索引位置

             console.log($("li").index())   //2因为前面有两个p,index值从0开始计算

             // 如果前后都传入jquery对象作为参数，那么就代表是返回

             // 第二个参数依据第一个参数的索引位置,且第二个属于第一个,否则返回-1,例如此时在ul以依据查找#n5索引位置

             console.log($("li").index($("#n7")))  //2

             console.log($("ul").index($("#n5")))  //-1

             console.log($("span").index($("#n8"))) //1

             // 返回结果值同上面，

             //   此用法和上不同之处在于:被查找元素传入jquery对象,为依据的元素传入DOM对象,此句翻译为

             //   第一个参数依据第二个DOM的索引位置,且第一个属于第二个

             console.log($("#n8").index("span"))

         </script>

     </body>

 </html>

e.target.value

target定义：

　　　　target 事件属性可返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。

语法：

　　　　event.target

　　　　event.target.nodeName  　　//获取事件触发元素标签name（li,p...）

　　　　event.target.id　　　　　　　//获取事件触发元素id

　　　　event.target.className　　//获取事件触发元素classname

　　　　event.target.innerHTML　　//获取事件触发元素的内容（li）

　　　　等。。。

this 与 e.target区别：

简单来说，this会冒泡。e.target不冒泡就是指向事件触发的dom。

this就是指向当前事件所绑定的元素，

e.target指向事件执行时鼠标所点击区域的那个元素。

容易搞不懂的地方是，初学者会认为当前事件所绑定的元素不就是鼠标所点击的那个元素嘛，这时候就要看看事件绑定的元素内部有没有子元素了，如果有子元素的话e.target指向这个子元素，如果没有，e.target和this都指向事件所绑定的元素。

事件委托：原生js

　　　　事件委托就是事件目标自身不处理事件，而是把处理任务委托给其父元素或者祖先元素，甚至根元素（document）。

　　　　使用事件委托时，如果目标元素上的其他事件处理程序使用.stopPropagation()阻止了事件传播，那么事件委托就会失效。

on

多个事件绑定同一个函数

 $("#elem").on("mouseover mouseout",function(){ });

通过空格分离，传递不同的事件名，可以同时绑定多个事件

多个事件绑定不同函数

$("#elem").on({

    mouseover:function(){},

    mouseout:function(){},

});

通过空格分离，传递不同的事件名，可以同时绑定多个事件，每一个事件执行自己的回调方法

将数据传递到处理程序

function greet( event ) {

  alert( "Hello " + event.data.name ); //Hello 慕课网

}

$( "button" ).on( "click", {

  name: "慕课网"

}, greet );

可以通过第二参数（对象），当一个事件被触发时，要传递给事件处理函数的

index()、e.target.value、on()与快捷处理的区别、的更多相关文章

  1. 超链接a标签的属性target的可选值有哪些以及区别

    超链接a标签的属性target的可选值有哪些以及区别 1.<a target="_blank"></a> 2.<a target="_par ...

  2. target，currentTarget和this三者的区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  3. html中的a标签的target属性的四个值的区别？

    target属性规定了在何处打开超链接的文档. 如果在一个 <a> 标签内包含一个 target 属性,浏览器将会载入和显示用这个标签的 href 属性命名的.名称与这个目标吻合的框架或者 ...

  4. 超链接a的target属性

    <a>标签的target意思很明确就是在哪里打开目标文档. 第一种情况: 默认情况:当我们没有设置超链接属性target的value值时默认是_self,即<a target=&qu ...

  5. android 中targetSdkVersion和与target属性的区别

    AndroidMenifest.xml中targetSdkVersion和project.properties中的target属性的区别      在AndroidMenifest.xml中,常常会有 ...

  6. 转-超链接a的target属性

    超链接a的target属性 <a>标签的target意思很明确就是在哪里打开目标文档. 第一种情况: 默认情况:当我们没有设置超链接属性target的value值时默认是_self,即&l ...

  7. 【详细解析】MySQL索引详解（ 索引概念、6大索引类型、key 和 index 的区别、其他索引方式）

    [详细解析]MySQL索引详解( 索引概念.6大索引类型.key 和 index 的区别.其他索引方式) MySQL索引的概念: 索引是一种特殊的文件(InnoDB数据表上的索引是表空间的一个组成部分 ...

  8. targetSdkVersion和与target属性的区别

    参考:http://blog.csdn.net/dai_zhenliang/article/details/8175781 AndroidMenifest.xml中targetSdkVersion和p ...

  9. python中一些相似用法的区别：index()和find()，dict[]和get()

    index和find在字符串中的区别: index()方法和find()方法相似,唯一的区别就是find方法不包含索引值会返回-1,而index()不包含索引值会抛出异常   同样的:获取字典dict ...

随机推荐

  1. 解决Oracle 11g ORA-01017错误代码

    在oracle的之前版本时, 你的用户名密码是大小写不敏感的, 但在11g中, 数据库默认密码的大小写是敏感的, 于是我们就知道了一个事实, 那就是jdbc在给oracle密码时, 会将其变成大写,真 ...

  2. ALV 顶栏的按钮设定

    *&---------------------------------------------------------------------* *& Report ZHJ_TEST0 ...

  3. bootstrap学习

    1. bootstrap使用了less作为预编译器,他是结构清晰层次分明的css页面构建样式,即使你不喜欢bootstrap的样式,你仍然可以借鉴bootstrap编写css的这种方式 2.boots ...

  4. FP-tree推荐算法

    推荐算法大致分为: 基于物品和用户本身 基于关联规则 基于模型的推荐 基于物品和用户本身 基于物品和用户本身的,这种推荐引擎将每个用户和每个物品都当作独立的实体,预测每个用户对于每个物品的喜好程度,这 ...

  5. Jmeter基础之---jmeter基础概念

    Jmeter基础之---jmeter基础概念 JMeter 介绍: 一个非常优秀的开源的性能测试工具. 优点:你用着用着就会发现它的重多优点,当然不足点也会呈现出来. JMeter 介绍: 一个非常优 ...

  6. tengine+tomcat配置

    # 根据你服务器的cpu核数来确定此值 worker_processes 4; error_log logs/error.log crit; #error_log logs/error.log not ...

  7. MVC 下 JsonResult 的使用方法（JsonRequestBehavior.AllowGet）【转】

    MVC 默认 Request 方式为Get. actionpublic JsonResult GetPersonInfo(){var person = new{Name = "张三" ...

  8. Angular $scope和$rootScope事件机制之$emit、$broadcast和$on

    Angular按照发布/订阅模式设计了其事件系统,使用时需要“发布”事件,并在适当的位置“订阅”或“退订”事件,就像邮箱里面大量的订阅邮件一样,当我们不需要时就可以将其退订了.具体到开发中,对应着$s ...

  9. php://input

    从官网信息来看,php://input是一个只读信息流,当请求方式是post的,并且enctype不等于"multipart/form-data"时,可以使用php://input ...

  10. Javascript模式（第二章基本技巧）------读书笔记

    本章主要帮助大家写出高质量的JS代码的方法,模式和习惯,例如:避免使用全局变量,使用单个的var变量声明,缓存for循环的长度变量length等 一.尽量避免使用全局变量 1 每一个js环境都有一个全 ...