<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .div1{
            color: #0000cc;
            font-size: 20px;
        }
    </style>
</head>

<body>
    <div>
        <div onclick="func(this)"  name="book1">hello 1</div>
        <div onclick="func(this)"  name="book2">hello 2</div>
        <div onclick="func(this)"  name="book3">hello 3</div>
        <div onclick="func(this)"  name="book4">hello 4</div>
    </div>
<script>                                                              //onclick 绑定的函数 传参数 关键字this
    function func(a) {                                                //  点击后直接获取本点击对象
        alert(a.getAttribute("name"));                                // 只能用getattribute 可以获得对象中的各种属性 name
        alert(a.innerHTML);                                            // 获取文本内容

        a.setAttribute("class","div1")                                 // 同样也可以给点击事件的对象 加入属性 class="div1"
    }                                                                   // div1 原来并没有加入 点击后 改变了字体大小颜色
</script>
</body>
</html>

js 中onclick 事件 点击后指向自己的对象,查找或者添加属性 用关键字this 传入参数 (可以改变原标签css)的更多相关文章

  1. JS中的事件、数组、节点对象处理

    在JS代码中编写事件一定要保证页面在浏览器中加载时会把事件加载进页面 事件:在代码中可以通过一个动作来触发另一个行为的总称 A:事件的编写方式1 HTML标签中添加 onxxxx = "函数 ...

  2. JS中onclick事件传参

    美术馆案例中,需要将“增加一个img标签,放入大图片”这样一个函数封装,但是在调用的时候需要传参. <script type="text/javascript"> on ...

  3. js中冒泡事件和捕获事件

    js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这 一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层 捕获 ...

  4. 看懂此文，不再困惑于 JS 中的事件设计

    看懂此文,不再困惑于 JS 中的事件设计 今天刚在关注的微信公众号看到的文章,关于JS事件的,写的很详细也很容易理解,相关的知识点都有总结到,看完就有种很舒畅的感觉,该串起来的知识点都串起来了.反正一 ...

  5. js中冒泡事件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. DOM 以及JS中的事件

    [DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...

  7. 从零开始的JS生活（二）——BOM、DOM与JS中的事件

    上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举 ...

  8. JS中的事件以及DOM 操作

    [DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...

  9. JS中的事件&对象

    一.JS中的事件 (一)JS中的事件分类 1.鼠标事件 click/dblclick/onmouseover/onmouseout 2.HTML事件 onload/onscroll/onsubmit/ ...

随机推荐

  1. [转]Programmatically Register Assemblies in C#.

    1. Introduction. 1.1 After publishing Programmatically Register COM Dlls in C# back in 2011, I recei ...

  2. 仓储(Repository)和工作单元模式(UnitOfWork)

    仓储和工作单元模式 仓储模式 为什么要用仓储模式 通常不建议在业务逻辑层直接访问数据库.因为这样可能会导致如下结果: 重复的代码 编程错误的可能性更高 业务数据的弱类型 更难集中处理数据,比如缓存 无 ...

  3. 【kudu pk parquet】TPC-H Query2对比解析

    这是[kudu pk parquet]的第二篇,query2在kudu和parquet上的对比解析,其中kudu包含有不能下发的谓词. 3台物理机,1T规模的数据集,impala和kudu版本是我们修 ...

  4. 十五、Node.js-fs模块（中）

    有了上一篇JS同步异步知识的铺垫,我们一起学习一下fs模块的同步和异步知识: Node.js内置的fs模块就是文件系统模块,负责读写文件. 和所有其它JavaScript模块不同的是,fs模块同时提供 ...

  5. Linux man语法结构说明

    一.man手册的内容结构(说明书页的格式): 标题含义: Name命令的名称和用途(摘要) Synopsis命令语法(摘要) Description完整描述 Environment命令使用的环境变量 ...

  6. HttpClient 基于连接池的使用

    场景:调用外部系统接口的http请求 要求: 1:可能是http请求,也可能是https请求 2:需要加入连接池的概念,不能每次发起请求都新建一个连接(每次连接握手三次,效率太低) 准备使用httpc ...

  7. python基础之内置函数（一）

    内建函数都在 _builtins_ 里面 (1)abs() 取绝对值 adb(-10) 10 (2)bool()将参数转换成布尔型,返回值是True或False 参数是数字时,0返回False,其他任 ...

  8. Java中的Date Time 与SQL Server 2005里的Datetime 之间的交互

    Preface Environment:Platform: Windows XPLanguage: Java 1.5IDE: MyEclipse 6.0.1Database: SQL Server 2 ...

  9. js 事件的阶段

    事件有三个阶段: 1.事件捕获阶段 :从外向内 2.事件目标阶段 :最开始选择的那个 3.事件冒泡阶段 : 从里向外   为元素绑定事件 addEventListener("没有on的事件类 ...

  10. SQL 判断Null

    字段 is null 这是多久没写SQL 了啊....................