1. 使用JQ时需要先引用 JQ 包； 其他的JQ代码 需要写在 引用标签的下面如下图[基本格式]

ＪＱ中　是纯代码　　没有判断 没有循环   如果 有 时间间隔和延迟  则使用ＪＳ　代码

　　详见　下面例题

因为代码　放在最后　　所以　JQ 可以加$(document).ready 也可以不加

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

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>无标题文档</title>

 <script src="jquery-1.11.2.min.js"></script>

 <style type="text/css">

 .aa{ width:200px; height:200px; float:left; margin:5px; background-color:#3F6}

 </style>

 </head>

 <body>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <input type="button" value="测试" onclick="test()" />

 </body>

 <script type="text/javascript">

 $(document).ready(function(){

         $(".aa").click(function(){

                 //所有元素背景色变成原来的

                 $(".aa").removeAttr("xz");

                 $(".aa").css("background-color","#3F6");

                 //找到点击了谁

                 $(this).attr("xz","1");

                 $(this).css("background-color","red");

             })

         $(".aa").mousemove(function(){

                 //所有元素背景色变成原来的

                 $(".aa").css("background-color","#3F6");

                 //找到点击了谁

                 $(this).css("background-color","yellow");

                 $("[xz='1']").css("background-color","red");

             })

 })

 </script>

 </html>

有$(document)

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

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>无标题文档</title>

 <script src="jquery-1.11.2.min.js"></script>

 <style type="text/css">

 .aa{ width:200px; height:200px; float:left; margin:5px; background-color:#3F6}

 </style>

 </head>

 <body>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <div class="aa">

 </div>

 <input type="button" value="测试" onclick="test()" />

 </body>

 <script type="text/javascript">

         $(".aa").click(function(){

                 //所有元素背景色变成原来的

                 $(".aa").removeAttr("xz");

                 $(".aa").css("background-color","#3F6");

                 //找到点击了谁

                 $(this).attr("xz","1");

                 $(this).css("background-color","red");

             })

         $(".aa").mousemove(function(){

                 //所有元素背景色变成原来的

                 $(".aa").css("background-color","#3F6");

                 //找到点击了谁

                 $(this).css("background-color","yellow");

                 $("[xz='1']").css("background-color","red");

             })

 </script>

 </html>

无$(document)

2.ＪＱ中得查找方法　　　找出来的　都是ＪＱＵＡＲＹ对象（数组形式存在）　　　０号索引位置　　为　　ｄｏｍ对象　

找元素,Jquery对象

		var b = $("#aa"); //根据ID找

		alert(b[0]);

		var b = $(".aa"); //根据class找

		alert(b[1]); //找到的是DOM对象

		alert(b.eq(1)); //找到的是Jquery对象

		var b = $("div"); //根据标签名找

		alert(b[0]);

		var b = $("[id='aa']"); //根据属性找

		alert(b[0]);

３.JQ 操作内容

			非表单元素

			b.html(); //操作元素里面的HTML代码

                                          b.html("<span style='color:red'>文字</span>");

			b.text(); //操作元素里面的文本

                                          b.text("文字");

			表单元素 （添加value值）

			b.val("hello");

4.　操作属性

			设置属性

			b.attr("bs","test");

			获取属性

			alert(b.attr("aa"));

			移除属性

			b.removeAttr("aa");

			checkbox 属性  使用下面的修改方式 避免重复（因为原文中有默认属性）

			b.prop("checked",false);

5.ＪＱ的　方法可以获取内嵌中的样式（JS操作 只可以获取 内联中的样式）

           设置内嵌中样式： b.css("background-color","red");

	 获取内嵌中得样式：alert(b.css("width"));

	                             alert(b.css("background-color"));

6.bind  绑定函数

$("body").unbind("mousemove");

$("body").bind("mousemove",function(e){});

　　

Jquary入门（ 修改内容）的更多相关文章

  1. POI根据EXCEL模板，修改内容导出新EXCEL （只支持HSSF）

    package excelPoiTest; import java.io.File; import java.io.FileInputStream; import java.io.FileOutput ...

  2. Oracle 中利用闪回查询确定某表在某时间点之后的修改内容，并恢复至该时间点

    Oracle 中利用闪回查询确定某表在某时间点之后的修改内容: 1.查看 DELETE 及 UPDATE 操作修改的数据: SQL> SELECT * FROM tab AS OF TIMEST ...

  3. Example011表单中修改内容

    <!-- 实例011表单中修改内容的方法 --> <!DOCTYPE html> <html lang="en"> <head> & ...

  4. dedecms中{dede:myad name='about'/} 修改内容

    网站首页index.htm中调用这个命令,显示一段文字,但是想要修改内容.所以想知道这个命令指定的文件内容在哪里寻找或者指定内容在哪里修改? 匿名 | 浏览 6036 次 发布于2014-02-19 ...

  5. git教程： 查看文件状态与修改内容

    转载:时光机穿梭 我们已经成功地添加并提交了一个readme.txt文件,现在,是时候继续工作了,于是,我们继续修改readme.txt文件,改成如下内容: Git is a distributed ...

  6. Git 查询某次历史提交的修改内容

    在工作时,有时候想查看某次的提交修改了哪些的内容. 我们首先可以git log显示历史的提交列表: 之后我们用git show <commit-hashId> 便可以显示某次提交的修改内容 ...

  7. 纸壳CMS（ZKEACMS）体验升级，快速创建页面，直接在页面中修改内容

    关于纸壳CMS 纸壳CMS又名 ZKEACMS Core 是ZKEACMS的 .net core 版本,可运行在 .net core 1.1 平台上.是一个开源的CMS. 纸壳CMS对于 ZKEACM ...

  8. Git以及github的使用方法（三），git status查看工作区的状态，git diff查看具体修改内容

    我们已经成功地添加并提交了一个readme.txt文件,现在,是时候继续工作了,于是,我们继续修改readme.txt文件,改成如下内容: Git is a distributed version c ...

  9. SVN查看项目修改记录及修改内容

    工具/原料 svn 一,查看修改记录 1 选择要查看的文件夹,打开之后在空白的地方右键. 2 选择svn里面的"查看日志".show_Log 3 在弹出的日志框里,可以看到,你可以 ...

随机推荐

  1. sql分页操作

    看到了网上关于分页的讲解  对最快的分页语句做了测试 还别说速度真快 总共6w条数据 速度确实so 快 前提是id是主键 或者是索引 declare @page int;--页数 declare @P ...

  2. sql 取汉字首字母

    )) ) --用于加密 --WITH ENCRYPTION as begin declare @intLen int ) ) set @intLen = len(@str) set @strRet = ...

  3. Socket编程（4）TCP粘包问题及解决方案

    ① TCP是个流协议,它存在粘包问题 TCP是一个基于字节流的传输服务,"流"意味着TCP所传输的数据是没有边界的.这不同于UDP提供基于消息的传输服务,其传输的数据是有边界的.T ...

  4. PL/SQL异常获取

    1.no_data SET SERVEROUTPUT ON DECLARE pename EMP.ENAME % TYPE ; BEGIN SELECT ename INTO pename FROM ...

  5. [bzoj3626][LNOI2014]LCA

    Description 给出一个$n$个节点的有根树(编号为$0$到$n-1$,根节点为$0$). 一个点的深度定义为这个节点到根的距离$+1$. 设$dep[i]$表示点$i$的深度,$lca(i, ...

  6. C# 扩展系统类方法

    1.声明扩展方法的步骤:类必须是static,方法是static 2.第一个参数是被扩展的对象,前面标注this 3.使用扩展方法的时候必须保证扩展方法类已经在当前代码中using 例子:using ...

  7. java 方法

    方法命名规范要求 类的命名规范:“全部单词的 首字母必须大写”.那么在定义方法的时候也是有命名规范要求的:“第 一个单词的首字母小写,之后每个单词的首字母大写”,那么这就是方法 的命名规范. 递归调用 ...

  8. Beta阶段第七次Scrum Meeting

    Beta阶段第七次Scrum Meeting 情况简述 BETA阶段第七次Scrum Meeting 敏捷开发起始时间 2016/12/20 00:00 敏捷开发终止时间 2016/12/21 00: ...

  9. 在不损坏C盘的情况下为C盘扩容，适用于Win

    2016年12月29日14:29:27 参考原文:http://jingyan.baidu.com/article/90808022a6c6b7fd91c80fc8.html 在不损坏磁盘的情况下给某 ...

  10. php采集远程图片