
jquery文檔就緒函數(onload、ready)、動态添加樣式、三種方法和它的屬性、基本篩選器、内容、可見性
文檔就緒函數
$:jquery的标志
onload:加載頁面中所有的内容,包含外部資源(圖檔、文檔等等檔案)
先加載頁面中所有内容及外部資源,再加載js代碼
ready(文檔就緒函數):加載頁面中的内容,不包含外部資源()
先加載頁面中所有的标簽内容,再加載js代碼,最後加載外部資源
文檔就緒函數的三種方法
文檔就緒函數第一種書寫格式
$(document).ready(function(){
alert("文檔就緒函數第一種書寫方法");
})
//文檔就緒函數第二種書寫方法
$().ready(function(){
alert("文檔就緒函數第二種書寫方法");
//文檔就緒函數第三種書寫方法
$(function(){
alert("文檔就緒函數第三種書寫方法");
屬性
$("#btn1").click(function() {
//隐藏圖檔
$("#img1").hide(); //隐藏
$("#btn2").click(function() {
$("#img1").show(); //顯示
$("#btn3").click(function() {
$("#img1").toggle(2000);//交替顯示和隐藏
$("#btn4").click(function() {
$("#img1").fadeOut(1000);//淡出 --隐藏
$("#btn5").click(function() {
$("#img1").fadeIn();//淡入 ---顯示
$("#btn6").click(function() {
$("#img1").fadeToggle(2000) //交替淡入淡出
$("#title").click(function(){
$("#contents").slideToggle();//下滑式交替顯示和隐藏
/*動态添加樣式*/
//css("css屬性名","css屬性值"):設定對象的css樣式
//addClass("新的class名稱"):添加樣式對象(要添加的樣式必須預先定義好再使用)
基本篩選器
:first 擷取比對的第一個元素
:not(selector) 去除所有與給定選擇器比對的元素
:even 比對所有索引值為偶數的元素,從 0 開始計數
:odd 比對所有索引值為奇數的元素,從 0 開始計數
:eq(index) 比對一個給定索引值的元素,從 0 開始計數
:gt(index) 比對所有大于給定索引值的元素,從 0 開始計數
:lt(index) 比對所有小于給定索引值的元素,從 0 開始計數
:lang1.9+
:last 擷取比對的最後個元素
:header 給頁面内所有标題加上背景色
:animated 隻有對不在執行動畫效果的元素執行一個動畫特效
:focus 比對目前擷取焦點的元素。
:root1.9+
:target1.9+
内容
:contains(text) 比對包含給定文本的元素
:has(selector) 比對含有選擇器所比對的元素的元素
:empty 查找所有不包含子元素或者文本的空元素
:parent 查找所有含有子元素或者文本的 td 元素
可見性
:hidden 查找隐藏的元素
:visible 查找所有可見的元素