ASP.NET动态网站制作(10)-- JQ(2)
前言:jq的第二节课。
内容:
1.管理选择结果:
(1)获取元素个数:$("img").size():获取页面中所有“img”个数;
(2)提取元素:$("img[title]"):获取所有设置了title属性的“img”标签;$("img[title]")[1]:表示获取所有设置了title属性的“img”标签中的第二个元素,等价于$("img[title]").eq(1);例:var iNum=$("li").index($("li[title=isaac]")[0])是获取<li title="isaac">标签在整个列表中所处的位置,并返回给iNum;$(this)表示当前操作对象;$(this).index表示获取当前操作对象的索引。
(3)添加、删除、过滤元素:$("img[alt],img[title]").addClass("myClass"):所有设置了alt属性(即若图片显示错误的话,给出的一个错误提示)的img标签和所有设置了title属性的img标签添加样式;删除样式的格式为:removeClass();
$("li[title]").not("title*=isaac")是所有设置了title属性的li标签,但不包括title值中任意匹配字符串Isaac的那些li标签(注:not()方法所接受的参数不包括特定的元素,只能是通用的表达式);
$("li").filter("[title*=isaac]")等价于$("li[title*=issac]"),filter中的参数不能直接是等于匹配,只能是前匹配^=,后匹配&=,任意匹配*=;filter(函数)函数要求返回布尔值,对于返回值为true的元素保留,否则去除。
$("p").find("span"):在所有的p标签中找span标签,获取一个新的元素集合;
var bHasImage=$("div").is("img"):页面中的div块是否包含img标签。
(4)jQuery链:jQuery语句链接在一起。
$("div").addClass("myClass1").filter(function(index){return index==1||$(this).attr("id")=="fourth"}).addClass("myClass2"):表示整体div加myClass1,然后进行筛选,筛选出的元素再加myClass2,后面的操作都是以前面的操作结果为对象的,如果操作对象为上一步对象,则用end方法,如:$("p").find("span").addClass("myClass1").end().addClass("myClass2")。
$("div").find("p").addClass("myBackground").andSelf().addClass("myBorder"):表示在div中找p,给p加myBackground,然后把div和p合并,添加myBorder,对div和p都有效。
2.标记的属性:
(1)each():遍历元素。
$(function(){
$("img").each(function(index){
this.title="这是第"+index+" 副图,id是 "+this.id;
});
});
(2)获取属性的值:
*<em>标签告诉浏览器把其中的文本表示为强调的内容。对于所有浏览器来讲,这意味着要把这段文字用斜体表示。
var sTitle=$("em:eq(1)").attr("title"),表示获取第二个em的title属性;
$("a[href^=http://]").attr("target","_blank"),设置属性值;
$("img").attr({src:"1.png",title:"flower",alt:"国家"}):设置多个属性值;
$("button").removeAttr("disabled"):删除属性值。
后记:复习,预习,练习。
ASP.NET动态网站制作(10)-- JQ(2)的更多相关文章
- ASP.NET动态网站制作(3)--css(2)
前言:css分为四次课讲完,第一节课内容见ASP.NET动态网站制作(2)--css(1),接下来的内容会涉及到定位.浮动.盒子模型(第二次课).css的具体应用(第三次课).css3(第四次课).今 ...
- ASP.NET动态网站制作(18)-- jq作业讲解及知识补充
前言:这节课主要讲解js及jq作业,并在作业讲解完后补充关于jQuery的一些知识点. 内容: 1.作业讲解:计算器那一块考虑的各种情况还不算完善,只实现了基本的功能,还需多多练习使用jQuery. ...
- ASP.NET动态网站制作(13)-- JQ(5)
前言:jq的最后一节课,主要讲解应用, 内容: 1.会飞的li: HTML代码: <!DOCTYPE html> <html xmlns="http://www.w3.or ...
- ASP.NET动态网站制作(12)-- JQ(4)
前言:这节课接着上次课的继续讲. 内容:接上--> 1.jq元素样式设置: (4)某个元素中是否含有某个css类别,返回布尔型:$("li:last").hasClass( ...
- ASP.NET动态网站制作(11)-- JQ(3)
前言:这节课主要是讲CSS作业,然后继续讲jQuery. 内容: 1.css作业讲解. 2.jq设置元素样式: (1)添加.删除css类别:$("div").addClass(& ...
- ASP.NET动态网站制作(9)-- JQ(1)
前言:从这节课开始讲jQuery的相关内容,这节课主要围绕jQuery的选择器展开. 内容: 1.jQuery是一个优秀的js框架,目前企业里大多数都是用jQuery(以下简称jq).jq是对js里一 ...
- ASP.NET动态网站制作(1)--html
前言:正式上课的第一课,讲的是前端部分的最基础内容:html. 前端:html,css,js 数据库:sql server 动态部分:.net,c#... IIS(Internet Informati ...
- ASP.NET动态网站制作(26)-- Ajax
前言:这节课讲解关于Ajax的相关内容. 内容: 1.当点击页面中的一个按钮提交数据或请求数据的时候,整个页面的信息都会提交(不管信息是否是提交或者请求的数据,页面中所有的数据都提交),这样耗用的时间 ...
- ASP.NET动态网站制作(20)-- C#(3)
前言:C#的第三节课,继续上次课的内容,依旧围绕基础的只是讲解. 内容: 1.StringBuilder类:由于string类一旦创建,则不能更改.如果做字符串拼凑的话,将会非常耗费空间,如: str ...
随机推荐
- Linux设备模型(热插拔、mdev 与 firmware)【转】
转自:http://www.cnblogs.com/hnrainll/archive/2011/06/10/2077469.html 转自:http://blog.chinaunix.net/spac ...
- 关于Xcode6 的自定义模板位置
自定义模板放置位置: Xode6 -> 打开App 后, /Contents/Developer/Platforms/iPhoneOS.platform/Developer/Library/Xc ...
- Android修改包名的方法,简单粗暴。
几分钟之内,简单粗暴的修改包名! 序:Android的新手玩家可能对修改包名这件事情很是烦恼,我这里给出一个最快的修改包名的方法,简单粗暴,喜欢的可以收藏一下. 开始修改 第一步:修改自己app mo ...
- H5页面唤起手机号
做手机H5页面的时候经常会碰到在某一个页面会显示一个手机号,坑爹的产品会说你点击一下能不能让手机弹出号码,然后拨打出去,我试了试各种百度来的方法都是失败的,比如下面的这个: <a href=&q ...
- python--网络爬虫一
http://hankjin.blog.163.com/blog/static/3373193720105140583594/ http://blog.csdn.net/wklken/article/ ...
- koa2 从入门到进阶之路 (三)
之前的文章我们介绍了一下 koa 路由,get 传值,动态路由,本节我们看一下 koa 中间件 以及 koa 中间件的洋葱图执行流程. 一.什么是 Koa 的中间件 通俗的讲:中间件就是匹配路由之前或 ...
- encodeURI 解码 编码
var uriStr = "http://www.baidu.com?name=张三&num=001 zs"; var uriec = encodeURI(uriStr); ...
- bzoj 5123: [Lydsy1712月赛]线段树的匹配
设f[0/1][x]为区间[1,x]的根向下 不选(0)或者选(1) 的dp pair<最优值,方案数>. 可以很容易的发现总状态数就是log级别的,因为2*n 与 (2*n+1 或者 ...
- 任务驱动,对比式学习.NET开发系列之开篇------开源2个小框架(一个Winform框架,一个Web框架)
一 源码位置 1. Winform框架 2. web框架 二 高效学习编程的办法 1 任务驱动方式学习软件开发 大部分人学习软件开发技术是通过看书,看视频,听老师上课的方式.这些方式有一个共同点即按知 ...
- An error occurred uploading to the iTunes Store - Please upgrade Java
Yesterday there were an update to Jave (1.6.0_31) in the "Software update", but now when I ...