首先对于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. P3412 仓鼠找sugar II

    思路 挺神的概率期望.. 好吧是我太弱了,完全没有往那里想 注意期望是具有线性性的,一条路径的期望可以变成每条边的期望求和 概率是某件事发生的可能性,期望是某件事确定发生的代价 首先没有终点的条件并不 ...

  2. facebook api之Access Tokens之Business Manager System User

    Business Manager System User Make programatic, automated actions on ad objects or Pages, or do progr ...

  3. 测试常用的sql语句总结

    测试中常用的sql语句,排名部分先后 1. 查询 SELECT * FROM 表名称 SELECT COUNT(DISTINCT column_name) FROM table_name 指定列的不同 ...

  4. C# widget

    Invoke(Delegate)的用法: //例如,要实时update窗体.如果在另一个线程中update,那么可以直接update(可以不在新线程中):也可以在Delegate中给出upate,然后 ...

  5. Log4j日志依赖

    <!-- https://mvnrepository.com/artifact/log4j/log4j --><dependency> <groupId>log4j ...

  6. C#Listview添加数据,选中最后一行,滚屏

    this.listView.Items.Add(lvi); this.listView.EnsureVisible(this.listView.Items.Count - 1); this.listV ...

  7. webservice跨域问题

    在webconfig里面加上   <httpProtocol>      <customHeaders>        <add name="Access-Co ...

  8. 两个DIV并排显示

    今天做的一个项目,需要做3个div,一个是总框(Div1),另外两个是子框,按比例填满div1,我设置好两个div的width和height,发现效果是两个子div上下显示,如图所示: 要想将两个DI ...

  9. windows与linux换行符

    我一次linux上写的脚本,利用vim进行脚本编写,然后下载下来在nodepad++上面打开,在nodepad上面新建了一个文件将原来文件内容复制过去,保存后下载复制文件在linux上面进行运行,发现 ...

  10. 力扣(LeetCode)728. 自除数

    自除数 是指可以被它包含的每一位数除尽的数. 例如,128 是一个自除数,因为 128 % 1 == 0,128 % 2 == 0,128 % 8 == 0. 还有,自除数不允许包含 0 . 给定上边 ...