ASP.NET动态网站制作（9）-- JQ（1）
前言：从这节课开始讲jQuery的相关内容，这节课主要围绕jQuery的选择器展开。
内容：
1.jQuery是一个优秀的js框架，目前企业里大多数都是用jQuery（以下简称jq）。jq是对js里一些常用功能的封装和简化，可以说jq是Write less, do more。jq的底层还是基于js。
2.使用jq之前，需要添加jquery.js文件。第一个例子：
HTML代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/demo.js"></script>
</head>
<body>
<input type="button" value="我是一个按钮" id="btn"/>
</body>
</html>
JS代码：
$(function() {
$("#btn").click(function() {
alert("Hello world~");
});
});
上面的代码虽然简单，但是它体现了我们操作jq的思路及思想：1.$(function(){});代表页面加载之后；2.$("#btn")找到jq对象；3.执行所需的事件click()；4.声明一个事件，用function()；5.完成事件里面的内容。
$(document).ready(function(){});就等价于$(function(){});---后面的写法是前面写法的简写，都表示页面加载之后。
$("#btn")是jq中的找到对象，document.getElementById("btn")是相应的js中的找到对象写法，由此可以看出jq的写法简单了很多。
3.jq中的“$”：
（1）选择器：id选择器（$("#showDiv")）；类选择器（$(".someClass")）；标签选择器（$("input")）
（2）特殊： $("p:odd")：选择所有位于奇数行的<p>标记；$("p:even")：选择所有位于j偶数行的<p>标记；
$("td:nth-child(1)")：所有表格行的第一个单元格，就是第一列；
$("li>a")：返回<li>标签中的所有子元素<a>，不包括孙元素；
$("a[title]")：选择所有设置了title属性的超链接；
$("a[href='www.bing.com']")：选择所有等于www.bing.com的超链接；
$("a[href^=http]")：选择所有设置了以http开头的超链接；
$("a[href$=pdf]")：选择所有以pdf结尾的超链接；
$("a[href*=pdf]")：选择所有包含pdf的超链接。
4.功能函数前缀：$.trim(sString)：去掉字符串前后的空格，但不能去掉字符串中间的空格。若要想去掉字符串中间的空格，用split()方法将字符串变为字符数组，然后遍历数组，若是空格则去掉就好，代码如下：
var sInput = $(#txt).val();
var aInput = sInput.split("");
for(var i = 0; i < aInput.length; i++)
{
if(aInput[i]==" ")
{
sInput = sInput.replace(" ","");
}
}
alert(sInput);
5.包含选择器：$("li:has(a)")：包含超链接的所有li标签。
6.位置选择器：$("p:first")：整个页面中的第一个p标签；
$("p:last")：整个页面中的最后一个p标签；
$("p:first-child")：选择所有的p标签，且这些p标签是其父标签的第一个标签；
$("p:last-child")：选择所有的p标签，且这些p标签是其父标签的最后一个标签；
$("p:nth-child(odd)").addClass("myClass")：选择所有的p标签，且这些p标签是其父标签的奇数行；
$("p:odd")：整个页面的奇数行p标签；
$("p:eq(4)")或$("p").eq(4)：第5个p标签，有两种写法；
$("p:eq(2)").siblings()：第3个p标签的兄弟，即除了第三个之外的所有p标签；
$("p:eq(2)").prev()：第3个p标签的前一个p标签；
$("p:eq(2)").next()：第3个p标签的后一个p标签；
$("p:eq(2)").parent().attr("id")：获取第3个p标签的父标签的id属性值；
$("p:gt(n)")：第n个（从0开始，不包括n本身）p标签之后的所有p标签，只有一种写法；
7.过滤选择器：$("input[name='a']")：选择所有name属性为a的input标签；
$(":button")：所有按钮；
$("div:contains(foo)")：所有包含了文本”foo“的元素；
$(":disable")：所有被禁用的元素，等价于：$("input[disabled=disabled]").attr("value","aaa");
$(":enable")：所有没有被禁用的元素；
$(":file")：所有上传文件；
$(":input")：所有表单元素；
$(":selected")：所有下拉菜单中被选中的项；
$(":visible")：所有可见的元素；
$(":submit")：所有提交按钮；
8.反向过滤：$("input:not(:radio)")：表示input中所有非radio元素；:not(filter)中的filter必须是过滤选择器，而不能是其他选择器。
后记：预习，复习，练习。
ASP.NET动态网站制作（9）-- JQ（1）的更多相关文章
- ASP.NET动态网站制作（3）--css（2）
前言:css分为四次课讲完,第一节课内容见ASP.NET动态网站制作(2)--css(1),接下来的内容会涉及到定位.浮动.盒子模型(第二次课).css的具体应用(第三次课).css3(第四次课).今 ...
- ASP.NET动态网站制作（18）-- jq作业讲解及知识补充
前言:这节课主要讲解js及jq作业,并在作业讲解完后补充关于jQuery的一些知识点. 内容: 1.作业讲解:计算器那一块考虑的各种情况还不算完善,只实现了基本的功能,还需多多练习使用jQuery. ...
- ASP.NET动态网站制作（11）-- JQ（3）
前言:这节课主要是讲CSS作业,然后继续讲jQuery. 内容: 1.css作业讲解. 2.jq设置元素样式: (1)添加.删除css类别:$("div").addClass(& ...
- 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动态网站制作（10）-- JQ（2）
前言:jq的第二节课. 内容: 1.管理选择结果: (1)获取元素个数:$("img").size():获取页面中所有“img”个数: (2)提取元素:$("img[ ...
- ASP.NET动态网站制作（20）-- C#（3）
前言:C#的第三节课,继续上次课的内容,依旧围绕基础的只是讲解. 内容: 1.StringBuilder类:由于string类一旦创建,则不能更改.如果做字符串拼凑的话,将会非常耗费空间,如: str ...
- ASP.NET动态网站制作（1）--html
前言:正式上课的第一课,讲的是前端部分的最基础内容:html. 前端:html,css,js 数据库:sql server 动态部分:.net,c#... IIS(Internet Informati ...
- ASP.NET动态网站制作（0）
前言:一直想系统地学习一下网站建设的相关内容,看过相关的书籍,也跟着视频学过,但总觉得效率不高,学过的东西印象不深刻,或许还是自己动手实践的少.无意中免费听了一堂讲ASP.NET网站建设的课,觉得性价 ...
随机推荐
- 00深入理解C指针之--- 指针之外
该系列文章源于<深入理解C指针>的阅读与理解,由于本人的见识和知识的欠缺可能有误,还望大家批评指教. C语言从诞生之初就非常善于和硬件打交道,经过这么多年的发展之后,其灵活性和超强的特征是 ...
- Spring积累总结
1.spring 的优点: 1.降低了组件之间的耦合性 ,实现了软件各层之间的解耦 2.可以使用容易提供的众多服务,如事务管理,消息服务等 3.容器提供单例模式支持 4.容器提供了AOP技术,利用它很 ...
- Python Challenge 第七关
第七关,只有一张图片,右键源代码也什么都没有,只是这图片上有一行类似马赛克一样的部分.看来答案只有在这张图上找了.下载了图片,去网上搜一下有什么库可以处理图像.搜到了一个PIL,发现安装的python ...
- ()centos6.8安装配置ftp服务器
ftp传输原理 客户端通过某软件用某个端口(a端口)向服务端发起tcp连接请求,同时告诉服务端客户端另一个空闲端口号(b端口),服务端用21端口与客户端建立一条控制连接通道. 接着在默认情况下,服务端 ...
- HDFS写文件过程分析
转自http://shiyanjun.cn/archives/942.html HDFS是一个分布式文件系统,在HDFS上写文件的过程与我们平时使用的单机文件系统非常不同,从宏观上来看,在HDFS文件 ...
- 10.1综合强化刷题 Day4
财富(treasure) Time Limit:1000ms Memory Limit:128MB 题目描述 LYK有n个小伙伴.每个小伙伴有一个身高hi. 这个游戏是这样的,LYK生活的环境是以 ...
- 基于WPF系统框架设计(8)-PasswordBox传值到ViewMode
应用场景 我要做一个系统登录功能,需要传用户名和密码到ViewModel中,可是PasswordBox传值到ViewModel中好像跟TextBox等控件不一样.这里需要用到附加属性. 附加属性:一个 ...
- 为Zepto添加Slide动画效果
一.缘由 公司的移动端项目,采用zepto为主要框架,但是zepto毕竟是精简版的jquery,体积小了,功能自然没有这么强大,特别是动画和选择器这两块,需要我们自己去拓展. 在项目开发过程中,很多页 ...
- Android Touch事件传递机制详解 上
最近总是遇到关于Android Touch事件的问题,如:滑动冲突的问题,以前也花时间学习过Android Touch事件的传递机制,可以每次用起来的时候总是忘记了,索性自己总结一下写篇文章避免以后忘 ...
- python pandas相关知识点（练习）
首先引入库文件,并进行数据读取 import pandas as pd import numpy as np data_Base=pd.read_csv("D:\\Exam_Test\\un ...