1、文档加载事件

2、DOM单击双击事件

3、DOM获得焦点，失去焦点问题

4、DOM鼠标移入，移出事件

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Jquery操作DOM节点</title>

 <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>

 <script type="text/javascript">

     $(document).ready(function(){

         //alert("文档加载完毕！");//文档加载

         $("#zs").click(function (){

             $("#p1").html('<font color=red>张三被点了！</font>');//单击事件

         })

         $("#zs").dblclick(function(){

             $("#p1").html('<font color="blue">张三被双击了！</font>');    //双击事件

         })

         //焦点事件

         $("#t1").focus(function (){

             $("#t1").val("获得焦点事件！");

         })

         //失去焦点事件

         $("#t1").blur(function(){

             $("#t1").val("失去焦点事件！");

         })

         //鼠标移入事件

         $("#d1").mouseover(function(){

             $("#d1").html("鼠标移入");

         })

         //鼠标移除事件

         $("#d1").mouseout(function(){

             $("#d1").html("鼠标出去了！");

         })

     });

 </script>

 </head>

 <body>

 <input id="zs" value="张三" name="zs" type="button"></input>

 <p id="p1"></p>

 <input id="t1" type="text" name="t1" />

 <div id="d1" style="border:1px solid red; width:100px;height:100px"></div>

 </body>

 </html>

Jquery操作事件的更多相关文章

  1. Jquery的事件操作和文档操作

    对于熟悉前端开发的小伙伴,相信对于Jquery一定不陌生,相对于JavaScript的繁琐,Jquery更加的简洁,当然简洁不意味着简单,我们可以使用Jquery完成我们想要实现全部功能,这里为小白们 ...

  2. jquery css事件编程 位置 操作

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

  3. jQuery操作Dom、jQuery事件机制、jQuery补充部分

    jQuery操作Dom: 修改属性: //使用attr()方法 //attr(name, value) //name:要修改的属性的属性名 //value:对应的值 //attr方法,如果当前标签有要 ...

  4. jQuery操作dom事件

    参考:jQuery权威指南jQuery初步jQuery选择器jQuery操作domjQuery操作dom事件jQuery插件jQuery操作AjaxjQuery动画与特效jQuery实现导航栏jQue ...

  5. jQuery中操作事件

    JavaScript中操作事件的方式是这样的: 元素.on事件名=function(){ //事件执行的代码 } 但是jQuery有点不同,他的格式是这样的: 元素.on("事件名" ...

  6. jQuery操作标签，jQuery事件操作，jQuery动画效果，前端框架

    jQuery操作标签 jQuery代码查找标签绑定的变量名推荐使用 $xxxEle 样式类操作 addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类 ...

  7. 对jquery操作复选框

    摘要:jquery操作复选框.使用更简洁易懂,思路清晰,逻辑更明了,很实用 <!DOCTYPE html> <html> <head> <meta chars ...

  8. 深入学习jQuery鼠标事件

    × 目录 [1]类型 [2]写法 [3]合成事件[4]鼠标按键[5]修改键[6]坐标位置 前面的话 鼠标事件是DOM事件中最常用的事件,jQuery对鼠标事件进行了封装和扩展.本文将详细介绍jQuer ...

  9. 从零开始学习jQuery (五) 事件与事件对象

    本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...

随机推荐

  1. oracle适配器连接不上解决方案

    Oracle适配器连接不上解决方案 作者:Vashon oracle 的Developer连接不上报错:listener does not currently know of SID given in ...

  2. 浏览器报错问题解决：Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight respons

    FAQ: Failed to load http://www.erpshop.com/index.php: Request header field Content-Type is not allow ...

  3. CocosCreator工程内的命名

    命名结构总体的命名结构遵循以下格式 前缀-内容-尾缀 - 前缀:用来定义node的属性- 内容:node的名字- 尾缀:序列或状态1231. 前缀说明:在开始的时候定义/声明这个节点的属性前缀可以是一 ...

  4. uva 1451 数形结合

    思路:枚举点t,寻找满足条件的点t': 计sum[i]为前i项合,平均值即为sum[t]-sum[t'-1]/t-t'+1 设(Pi=(i,Si),表示点在s中的位置,那么就可以画出坐标图,问题就转化 ...

  5. vgg16原始的protocol

    # Enter your network definition here. # Use Shift+Enter to update the visualization.name: "VGG_ ...

  6. Must set property 'expression' before attempting to match

    因为这个问题没有直接指向问题的地点, 所以找起来不是很容易. 但是如果找不到, 这个错就会一直都存在. 原因分析: 在使用切面编程的时候, 没有把切入点配置全面 解决方法: 在before, afte ...

  7. win10x64下的redis安装与使用

    先引用百度百科的一段话吧,具体可以到百科查看吧. Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API.从2010年 ...

  8. node.js从入门到放弃（一）

    以下内容全是我个人理解写出,如有不对,请立刻练习本人进行更改.以免被刚入门的被我带入坑里. —node是什么?我想大家应该都知道. node是前端未来干掉后端的一种语言,是用JavaScript来编写 ...

  9. 【简●解】[AHOI2009]中国象棋

    [题目大意] 叫你在\(n×m\)的棋盘上放若干个炮(可以是0个),使得没有一个炮可以攻击到另一个炮,问有多少种放置方法. [关键词] \(DP\) 分类讨论 乘法和加法原理 [分析] 仔细观察就会发 ...

  10. openjudge-4017 爬楼梯

    总时间限制: 1000ms 内存限制: 65536kB 描述 树老师爬楼梯,他可以每次走1级或者2级,输入楼梯的级数,求不同的走法数 例如:楼梯一共有3级,他可以每次都走一级,或者第一次走一级,第二次 ...