提起做前端,如果不知道jQuery怕是比不知道HTML5更让人吃惊。。。导致自己从来不敢说自己学过前端。
jQuery有下载到本地和直接利用CDN内容分发网络两种应用方式。jQuery必须等浏览器加载完HTML的DOM对象之后才能够执行,可以通过.ready()方法可以确定组件完成加载。基本架构如下:
jQuery(document).ready(function(){
//对应代码
});
由于使用的频繁性,代码头的jQuery可以由'$'字符代替$(document).ready(function){
//代码
});
更有甚者,直接采用更加简洁的写法
$(function(){
//代码
});
其实从jQuery这个名字基本语法和CSS类似。包含了选择器和操作两个部分
$(选择器).操作()
选择器分为标记选择器、id选择器(#)、class选择器(.)三种。同样jquery的搜寻可以采用嵌套搜寻($("div p")),精准定位。$("p") //HTML标记
$("#try") //id
$(".try") //class
表示法 | 说明 |
$("*") | 选择所有组件 |
$(this) | 选择目前作用中的组件 |
$("p:first") | 选择第一个<p>组件 |
$("[href]") | 选择有href属性的组件 |
$("tr:even") | 选择偶数<tr>组件 |
$("tr:odd") | 选择奇数<tr>组件 |
$("div p") | 选择<div>组件里面包含的<p>组件 |
$("div").find("p") | 选择<div>组件里面的<p>组件 |
$("div").next("p") | 搜寻<div>组件之后的第一个<p>组件 |
$('li').eq(2) | 搜寻第3个<li>组件,eq()里的值表示组件的位置 ,只能输入整数 |
$("div").css("background-color", "red");