首先对于JavaScript的一些复习：操作内容，操作属性，操作样式

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

<style>

#aa

{

	width:200px;

	height:200px;}

</style>

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

</head>

<body>

<div id="aa" style=""><span>hello</span></div>

<div class="bb">22</div>

<div class="bb">33</div>

<div class="bb">44</div>

<input type="text" name="cc" bs="dd" />

</body>

<script type="text/javascript">

//根据ID找元素,找到具体的DOM对象

var a = document.getElementById("aa");

var b = document.getElementsByClassName("bb");

//b[0].style.color="red";

var di= document.getElementsByTagName("div");

var input = document.getElementsByName("cc");

//操作内容

//1.非表单元素

//var d = document.getElementById("aa");

d.innerHTML;

d.innerText;

//2.表单元素  取value

d.value;

//操作属性

d.setAttribute("bs","aa");//设置属性（属性名，属性值）

d.getAttribute("bs");//获取属性（属性名）

d.removeAttribute("bs");//移除属性（属性名）

//操作样式

d.style.color = "red";

d.style.backgroundColor = "blue";

alert(d.style.width);//获取不到，因为获取只能获取到内联的不能在外面的

</script>

　　

在Jquery中的一些基本的内容：与上面对比开来：也是分为操作内容，操作属性，操作样式

<!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>

<style>

#aa

{

	width:200px;

	height:200px;}

</style>

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

</head>

<body>

<div id="aa" style=""><span>hello</span></div>

<div class="bb">22</div>

<div class="bb">33</div>

<div class="bb">44</div>

<input type="text" name="cc" bs="dd" />

</body>

<script type="text/javascript">

//jquery中的

$(document).ready(function(e) {

   //根据ID找元素，找出的JQUERY对象，如果要取DOM对象，取索引0的元素

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

	var ba = $(".bb");//根据Class

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

	var ip = $("input[name=cc]");//根据筛选属性

	var ip1 = $("input[bs=dd]"); //根据筛选属性,不加空格

	//alert(ip1.eq(0)[0]);

	for(var i=0;i<b.length;i++)

	{

		ba.eq(i);	 //取数组里面的第几个JQUERY对象

	}

	//操作内容

	//非表单元素

	jd.text();  //jd.text("你好");	//（）里面没有是取值，有是赋值

	jd.html();	//jd.html("好啊");	//同上

	//2.表单元素

	aa.val();

	//操作属性

	jd.attr("bs","aa");//设置属性（属性名，属性值）

	jd.attr("bs");//获取属性（属性名）

	jd.removeAttr("bs");//移除属性（属性名）

	//操作样式

        jd.css("background-color","red");//一个参数是获取，两个是添加

	//alert(jd.css("width"));

	//给一个元素加事件

	/*$("#aa").click(function(){

		alert("aa");

		})*/

	//给多个元素加事件

	/*$(".bb").click(function(){

		alert($(this).text());

		})*/

	//给多个元素设置相同样式(属性)

	//$(".bb").css("color","pink");

});

</script>

</html>

　　

关于jquery的一些练习题：实现全选功能，输出选中项，设置选中项

<!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>jquery的例子</title>

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

</head>

<body>

<input type="checkbox" id="all" /> 全选<br />

<input class="t" type="checkbox" value="aa" /> aa

<input class="t" type="checkbox" value="bb" /> bb

<input class="t" type="checkbox" value="cc" /> cc

<input class="t" type="checkbox" value="dd" /> dd

<input class="t" type="checkbox" value="ee" /> ee

<input type="button" id="button" value="点击获取数据" />

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

<input type="button" id="select" value="提交" />

</body>

</html>

<script type="text/javascript">

$(document).ready(function(e) {

	//全选

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

		var ck = $(".t");

		var xz = $(this)[0].checked;

		ck.prop("checked",xz);

		})

	//输出取选中的值

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

		var ck = $(".t");

		for(var i=0;i<ck.length;i++)

		{

			if(ck.eq(i).prop("checked"))//ck.eq(i)[0].checked

			{

				alert(ck.eq(i).val());

			}

		}

		ck.prop("checked",false);//清除选项

		})	

	//设置某项选中

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

		var rr = $("#tex").val();

		var ck = $(".t");

		ck.prop("checked",false);//清除选项

		for(var i=0;i<ck.length;i++)

		{

			if(ck.eq(i).val()==rr)

			{

				ck.eq(i).prop("checked",true);

			}

		}

		})	

});

</script>

　　

5月13 jquery的一些应用的更多相关文章

  1. JavaScript图表FusionCharts免费在线公开课，由印度原厂技术工程师主讲，10月13日发车

    FusionCharts公开课达人还你做 轻松晋升图表大师 [开课时间]10月13日 14:30[主讲老师]印度原厂技术工程师[开课形式]网络在线公开课[活动费用]前50名免费 现在就可以报名哦  报 ...

  2. [转载]Ubuntu17.04（Zesty Zapus）路线图发布：2017年4月13日发布

    Canonical今天公布了Ubuntu 17.04(Zesty Zapus)操作系统的发布路线图,该版本于今年10月24日上线启动,toolchain已经上传且首个daily ISO镜像已经生成.面 ...

  3. 2015年12月13日 spring初级知识讲解（四）面向切面的Spring

    2015年12月13日 具体内容待补充...

  4. 号外号外：9月13号《Speed-BI云平台案例实操--十分钟做报表》开讲了

    引言:如何快速分析纷繁复杂的数据?如何快速做出老板满意的报表?如何快速将Speed-BI云平台运用到实际场景中?         本课程将通过各行各业案例背景,将Speed-BI云平台运用到实际场景中 ...

  5. 2016年12月13日 星期二 --出埃及记 Exodus 21:8

    2016年12月13日 星期二 --出埃及记 Exodus 21:8 If she does not please the master who has selected her for himsel ...

  6. 2016年11月13日 星期日 --出埃及记 Exodus 20:4

    2016年11月13日 星期日 --出埃及记 Exodus 20:4 "You shall not make for yourself an idol in the form of anyt ...

  7. 2016年10月13日 星期四 --出埃及记 Exodus 18:24

    2016年10月13日 星期四 --出埃及记 Exodus 18:24 Moses listened to his father-in-law and did everything he said.于 ...

  8. 微软MVP社区夏日巡讲北京站 7月13日星期六 微软北京望京Office

    微软MVP社区夏日巡讲 开营啦 时间: 7月13日星期六 地点: 微软北京望京Office 报名方式:请看下图宣传海报 微软最有价值专家联合微软云创新中心专家为您呈现精彩的Windows 应用开发和W ...

  9. 09.13日记（2014年9月13日00:18:26）英语，bootstrap，阮一峰，

    我们这里只推荐一本语法书:台湾的旋元佑老师写的<文法俱乐部>(简体版名为<语法俱乐部>).这本书因为出版社倒闭而绝版,淘宝可以买到影印的版本. (1)学英语:奶爸的英语教室 资 ...

随机推荐

  1. Centos 安装R

    1 下载R源代码 原码下载地址https://cloud.r-project.org/https://cloud.r-project.org/src/base/R-3/R-3.4.2.tar.gz 2 ...

  2. InnoDB锁笔记

    InnoDB主要使用行级锁(row lock),其行锁是通过在索引项上加锁而实现的,如果MySQL的执行计划没有用到索引,那么行锁也就无意义了 InnoDB的行锁是通过给索引上的索引(聚集,非聚集)添 ...

  3. Docker：Service

    Prerequisites Install Docker version 1.13 or higher. Get Docker Compose. On Docker for Mac and Docke ...

  4. Tag Helpers in forms in ASP.NET Core

    Tag Helpers in ASP.NET Core Tag Helpers in forms in ASP.NET Core HTML Form element ASP.NET Core buil ...

  5. cmd中utf-8编码的问题

    有时候我们需要使用cmd显示某个utf-8编码的文本,这时候就需要设置cmd的代码页为65100. 也就是 chcp 65001 这条命令.这样设置可以临时生效. 如何要永久生效,需要在注册表中修改. ...

  6. python线程 有问题？

  7. [c][c++]按位操作

    因为有时候需要大量的标志位来判断当前状态等.使用太多的int,bool等会使得程序不“漂亮” 这时候需要“位”操作来解决 建立一个标志位 unsigned ; 在定义一些宏,如 #define CON ...

  8. Android自定义权限

    一.自定义权限 自定义权限,一般是考虑到应用共享组件时的安全问题.我们知道在四大组件 AndroidManifest 中注册的时候,添加 exported = "true" 这一属 ...

  9. Android集成人脸识别demo分享

    本应用来源于虹软人工智能开放平台,人脸识别技术工程如何使用? 1.下载代码 git clone https://github.com/andyxm/ArcFaceDemo.git 2.下载虹软人脸识别 ...

  10. Qt Model/View学习(二)

    Model和View的搭配使用 DEMO pro文件 #------------------------------------------------- # # Project created by ...