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. windows 10专业版14393.447 64位纯净无广告版系统 基于官方稳定版1607制作 更新于20161112

    系统特点: 447更新日志(Win10 PC一周年更新正式版14393.447 32位/64位更新补丁KB3200970下载 Flash补丁Kb3202790下载): 1.通过网友的反馈,保留了Edg ...

  2. input placeholder属性 样式修改(颜色,大小,位置)

    placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  3. Windows10配置NFS服务端和客户端

    环境:Windows10企业版x64 安装服务端 安装hane win nfs server,版本1169(官方最新版1223经试验不成功). 设置如下: 以管理员身份重启服务(注:软件界面上&quo ...

  4. C# 获取磁盘剩余空间

    drive.TotalFreeSpace单位为bit,根据需要除以1024 drive同时可以可以获取磁盘分区容量等 //单位MB public static long GetHardDiskSpac ...

  5. nginx之location匹配优先级和安全问题

    最近一直在做location的配置,遇到优先级别问题(如有配置不当,会存在安全隐患),以下是个人的一些学习体会 一.location 匹配符 1.等于匹配符:      ##"=" ...

  6. Java中FilterInputStream和FilterOutputStream的用法

    FilterInputStream FilterInputStream 的作用是用来"封装其它的输入流,并为它们提供额外的功能".它的常用的子类有BufferedInputStre ...

  7. 深入分析HTTP状态码502（nginx+php-fpm）

    我们的一个web项目,由于新上城市增多,导致访问量增大,DB压力增大,作为提供接口的业务方,最近被下游反馈大量请求"502". 502,bad gateway,一般都是upstre ...

  8. ruby 基础知识(二)

    ruby  中的动态方法 http://singleant.iteye.com/blog/1680382 Rails 大量使用了符号(symbol).符号看上去很像变量名,不过以冒号作为前缀.符号的例 ...

  9. Django 1.7 Tutorial 学习笔记

    官方教程在这里 : Here 写在前面的废话:)) 以前学习新东西,第一想到的是找本入门教程,按照书上做一遍.现在看了各种网上的入门教程后,我觉得还是看官方Tutorial靠谱.书的弊端一说一大推 本 ...

  10. 前端构建工具之gulp_常用插件

    gulp常用插件的使用 今天来看看一下gulp的常用插件的使用 就像gruntjs需要一个Gruntfile.js文件一样,gulp也需要一个文件作为它的主文件,在gulp中这个文件叫做gulpfil ...