abstract:日期: 1月21日 ~ 2月1日;時段: 20:00 ~ 22:00;### 教學(xué)內(nèi)容:+ jQuery + bootstrap+ 仿'新浪微博'與'抖音'小程序頁面;===============================================================- jquery+ jQuery 是一個 JavaScript
日期: 1月21日 ~ 2月1日;
時段: 20:00 ~ 22:00;
### 教學(xué)內(nèi)容:
+ jQuery + bootstrap
+ 仿'新浪微博'與'抖音'小程序頁面;
===============================================================
- jquery
+ jQuery 是一個 JavaScript 庫;jQuery 極大地簡化了 JavaScript 編程
+ jquery的安裝(下載jquery的庫 jquery.com 線上、)
+ 基本語法:(jQuery 語法是通過選取 HTML 元素,并對選取的元素執(zhí)行某些操作)
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(selector).action()
美元符號定義 jQuery;
(selector)選擇器 用于"查詢"和"查找" HTML 元素;
action() 執(zhí)行對元素的操作;
$(選擇器).需要執(zhí)行的操作()
=================================================
文檔就緒函數(shù) ready() (也稱為jQuery入口函數(shù)) 作用: 為了防止文檔在完全加載(就緒)之前運行 jQuery 代碼
$(document).ready(function(){
// 執(zhí)行代碼
});
或者簡寫為:
$(function(){
// 執(zhí)行代碼
});
==================================================
JavaScript 入口函數(shù):
window.onload = function () {
// 執(zhí)行代碼
}
jQuery 入口函數(shù)與 JavaScript 入口函數(shù)的區(qū)別:
jQuery 的入口函數(shù)是在 html 所有標(biāo)簽(DOM)都加載之后,就會去執(zhí)行;
JavaScript 的 window.onload 事件是等到所有內(nèi)容,包括外部圖片之類的文件加載完后,才會執(zhí)行;
jQuery事件
==============================================================================================
$(document).ready()當(dāng)文檔完成加載時;
$(selector).click()被選元素的點擊事件;
$(selector).focus()被選元素的獲得焦點事件;
$(selector).mouseover()當(dāng)鼠標(biāo)指針移上被選元素元素時;
$(selector).mouseleave()當(dāng)鼠標(biāo)指針離開被選元素元素時;
jQuery事件原理:當(dāng)事件被觸發(fā)時會調(diào)用一個函數(shù)(事件處理函數(shù);
如: $(selector).click(function) 我們稱之為事件方法;
jQuery中的事件方法:就是觸發(fā)被匹配元素的事件,調(diào)用一個函數(shù);或理解為將函數(shù)綁定到所有被匹配元素的某個事件上;
$(selector).click(function(){
// 當(dāng)事件觸發(fā)時,執(zhí)行的代碼需要執(zhí)行的代碼塊
})
jQuery選擇器
================================================================================
jQuery 中所有選擇器都以美元符號開頭:$(),它基于已經(jīng)存在的 CSS 選擇器;
元素選擇器、#id選擇器、.class類選擇器 類型、屬性、屬性值;
頁面轉(zhuǎn)到 demo (1).html
jQuery遍歷(用一種相對的關(guān)系來查找html元素)
=======================================================
向上查找(祖先元素)
parent() 方法返回被選元素的直接父元素
parents() 方法返回被選元素的所有祖先元素
$("span").parents().css("color","red");
使用可選參數(shù)來過濾對祖先元素的搜索
$("span").parents("ul").css("color","red");
該例返回所有span元素的所有祖先,并且它是ul元素
parentsUntil() 方法返回介于兩個給定元素之間的所有祖先元素
$("span").parentsUntil("div").css("border","2px solid red");
該例返回介于span與div元素之間的所有祖先元素
Correcting teacher:韋小寶Correction time:2019-01-23 09:05:19
Teacher's summary:這是vip課程交作業(yè)的地方,不是直播課交作業(yè)的,直播的作業(yè)是通過博客來交的,群里的視頻教程沒看么?要求沒看么?