一、js与jquery的区别
js是一种脚本语言，而jquery对它进行了封装使得js开发起来更简单。
二、新建web项目步骤
1、新建web项目时选择第二个,取一个项目名称。
2、系统生成的多余文件夹删掉，仅留下Scripts和Web.config：
3、修改Scripts文件夹为js，新建文件夹css和image，并在对应位置添加需要的页面，css样式文件与js文件。
4、将.min.js文件拖动到html中，将自己新建的js文件拖动到它下方
*这里引入js有先后顺序，先引用jquery文件，再引用js。
将Script文件夹中的第一个js文件（_references.js），拖动到自己新建的js文件里的最上面
*此步骤作用：让jq显示智能提示，方便写代码。
完成以上步骤，即可开始正常程序编写。
三、jquery执行过程与写法
1、jq执行过程分为下面5个步骤：
a、 对页面进行加载：$(function(){ });
b、 找到对象，如id标签：$(“#btn”)
c、 执行对象相应事件：click();
d、 声明事件：function(){ }
e、 执行事件内容：alert();
jquey写法
例：给html中id名称为btn的执行一个点击事件，执行事件的内容是弹出aaaa;
html:
<input type="button" value="jq按钮" id="btn"/>
js:
$(function () { $("#btn").click(function () { alert("aaaa"); });
});
js写法
$(function () {
document.getElementById("btn").onclick = function () { alert("aaaa");
});
2、Js对象转jquery对象
var v=document.getElementById("v"); //DOM对象 var $v=$(v); //jQuery对象 转换后，就可以任意使用jQuery的方法了。
例子：
html:
<input type="button" value="js按钮" id="btn"/>
js:
var obj = document.getElementById("btn"); //DOM对象 var $obj = $(obj); //jQuery对象 $obj.click(function () { alert("aaaa"); });
3、jquery对象->js
$("#btn") //jQuery对象 $("#btn")get(0) //jQuery对象->原生的DOM对象
例：jquery对象->js就，就可以执行js事件了
html:<input type="button" value="jq按钮" id="btn"/>
js: var obj = $("#btn").get(0); obj.onclick = function () { alert("aaa"); }
优先级问题：当css和jq中同时设置了样式时，遵循就近原则，此时的jq写法，类似于在html标签内加一个style样式来写，所以优先jq。
四、jq选择器
$(“tr:odd”)， 选择所有位于奇数行的< tr >标记
$(“tr:even”) ，选择所有位于偶数行的< tr >标记
【例】表格隔行换色的效果
$(function(){
$(“tr:odd”).css(“background”,”#f8f3d2”); //偶数行的背景颜色为#f8f3d2
$(“tr:even”).css(“background”,”#ffcdcd”); //奇数行的背景颜色为#ffcdcd
});
2、eq(n)选择器：$("X:eq(n)")
对X标签的第n+1个X标签进行选择，也可以写作$(“X”).eq(n)。
如：$(“tr”).eq(2)，是指tr标签的第三行进行选择。
3、 特殊
nth-child(n)选择器：$(“X:nth-child(n)”)
对X标签的第n个X标签进行选择。
如：$(“td:nth-child(3)”) ，是指第3列； $(“li:nth-child(4)”)，就是第4个li标签。
$(“li>a”) 返回<li>标记的所有子元素<a>,不包括孙标记。
(“a[href$=pdf]”)选择所有超链接，并且这些超链接的href属性是以“pdf”结尾；
4、功能函数
$trim(sString); 去掉前后空格；
去掉中间空格：
用正则：
var sString = "hello world"; String.prototype.NoSpace = function() { return this.replace(/\s+/g, ""); } alert(sString.NoSpace());
转换为数组：【
例】去掉字符串中间空格：（把字符串变成字符数组，然后把空格替换成无）
var s="das das";
var aChar=s.split(""); //将字符串变为字符数组
for(var i=0; i<aChar.length;i++)
{
if(aChar[i]==" ") //当遇到某个字符是空格时
{
s=s.replace(" ",""); //将此空格替换成无（从空格替换到连空格都不是）
}
}
alert(s); //打印s
5、创建DOM元素
var oNewP = $("<p>这是一个感人肺腑的故事</p>"); //创建DOM元素 oNewP.insertAfter("#btn"); //insertAfter()方法
将dom元素p插入#btn标签后面
6、属性选择器
6.1 所有标签写法$(“某标签[某属性]”)：选出带有某种属性的某标签。
6.1.1$(“a[title]”).addClass(“myClass”) 给a标签的title属性增加myClass样式
6.1.2 $(“a[href=’10-9.html’]”).addClass(“myClass”) 给a标签的href=’10-9.html’属性增加myClass样式
6.2.3 $(“a[href^=http://]”).addClass(“myClass”) 所有以http://开头的a标签
6.2.4 $(“a[href$=html]”).addLClass(“myClass”) 所有以html结尾的a标签
6.2.5 $(“a[href*=isaac]”).addClass(“myClass”) 所有href中含有isaac的a标签
7、包含选择器
$(“某标签:has(某属性)”)：选出包含某属性的所有某标签。如：$(“li:has(a)”) 包含超链接的所有li标记
8、位置选择器
$(“某标签:某位置”) ：选出某特定位置的某标签。如：
1）$(“p:first”) 选择页面中的第一个p标签
2）$(“p:last”) 选择页面中的最后一个p标签
3）$(“p:first-child”) 选择所有的p标记，且这些p标记是其父标记的第一个标记。
4）$(“p:last-child”) 选择所有的p标记，且这些p标记是其父标记的最后一个标记。
5）$(“p:nth-child(odd)”).addClass(“myClass”) 选择所有的p标记，且这些p标记是其父标记的偶数行。
6）$(“p:odd”).addClass(“myClass”) 整个页面的偶数行p标记
7）$(“p:eq(4)”).addClass(“myClass”) 第五个p标记增加class样式
$("p").eq(4).addClass(“myClass”)
$("p").eq(4).css("color","red") 相当于style
8）$(“p:gt(n)”).addClass(“myClass”) 第n个（从0开始，不包括n本身）p标记之后的所有p标记，也就是从第n+2个标记开始算，如$(“p:gt(2)”)就是从第四个p开始。
9、过滤选择器
过滤选择器
*备注：$(":file") 等价于$(“input[type=file]”)
|
$(“:button”) |
所有按钮 |
|
$(“:checkbox”) |
所有复选框,等同于$(“input[type=’checkbox’]”) |
|
$("div:contains(‘ foo ‘)") |
所有包含了文本“foo”的元素 |
|
$(“:disable”) |
所有被禁用的元素（此写法有问题，代替写法：$("input[disabled=disabled]").attr("value", "aaa");） |
|
$(“:enable”) |
所有没有被禁用的元素 |
|
$(“:file”) |
所有上传文件 |
|
$(“:input”) |
所有表单元素 |
|
$(“:selected”) |
所有下拉菜单中被选中的项 |
|
$(“:visible”) |
所有可见的元素 |
|
$(“:submit”) |
所有提交按钮 |
14、反向过滤器：
$(“标签:not(:某属性)”)：选出所有不具备某属性的某标签。
意思为：过滤掉所有含有“某属性”的标签，留下其它不具备该属性的标签。
如：$(“a:not(:target)”),意思就是选出所有没写target的a标签。