<!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. Castle Windsor 注册组件

    1.逐个注册组件即对每个接口通过代码指定其实现类,代码: container.Register( Component.For<IMyService>() //接口 .Implemented ...

  2. 安卓手机传递文件到Windows系统电脑

    1.需求说明 安卓手机传递文件到Windows系统电脑上不太方便,传递文件的原理花样太多.这里介绍纯净原生的蓝牙文件传递方式. 2.操作步骤 2.1 打开侧边栏面板 2.2 打开蓝牙,右键转至设置 2 ...

  3. 第二篇：git创建流程

    1.创建组织 2.创建 3.点击项目 创建完: 4.选择管理——>选择公钥——>添加个人公钥: 5.怎样生成公钥 5.1.如何生成ssh公钥 你可以按如下命令来生成 sshkey: ssh ...

  4. 移动端页面怎么适配ios页面

    1.viewport 简单粗暴的方式:<meta name="viewport" content="width=320,maximum-scale=1.3,user ...

  5. P1129 [ZJOI2007]矩阵游戏（二分图，网络流）

    传送门 这推导过程真的有点可怕的说……完全想不出来…… 最终状态是$(1,1),(2,2),(3,3)...(n,n)$都有一个黑点 我们可以理解为每一个行和列都形成了一个匹配 换句话说,只要$n$行 ...

  6. 运行Scrapy工程，报错ModuleNotFoundError: No module named 'win32api'解决方法

    1.运行爬虫scrapy crawl name,报错ScrpyModuleNotFoundError: No module named 'win32api' 2.解决方法: 在https://gith ...

  7. POM很重要的3个关系

    POM有3个很重要的关系:依赖.继承.合成. 1.依赖关系 <dependencies></dependencies> 2.继承 <parent></pare ...

  8. libcaffe.so.1.0.0: cannot open shared object file: No such file or directory 运行时报错

    caffe安装好后lib没有配置到/usr/lib或/usr/local/lib中,需手动配置: sudo vim ~/.bashrc export LD_LIBRARY_PATH=your_path ...

  9. Navicat Premium 12破解激活

    下载Navicat Premium 12并安装: 蓝奏云下载:Navicat Premium 12注册机   链接:https://pan.baidu.com/s/1mN-urlh--SX1vbq7h ...

  10. springcloud微服务总结三 服务客户端

    一 springcloud服务理解: dubbo中服务注册和调用都是都过注解来进行的,dubbo中在service层中调用服务是通过将@service注解改变为dubbo代码架包中的service注解 ...