首頁技術(shù)文章正文

JS教程:JavaScript核心視頻教程【webAPI】

更新時(shí)間:2021-10-21 來源:黑馬程序員 瀏覽量:


JavaScript核心WebAPI教程
簡(jiǎn)介

本套課程講解如何獲取DOM元素,如何操作DOM 元素,BOM操作, 事件,事件對(duì)象,事件委托,JS執(zhí)行隊(duì)列,定時(shí)器,常見網(wǎng)頁特效,比如輪播圖,tab欄切換等。 還會(huì)講解移動(dòng)端如何制作網(wǎng)頁特效,帶你進(jìn)入JavaScript的實(shí)際開發(fā)應(yīng)用。

1634803425225_webapi.jpg

百度云盤:https://pan.baidu.com/s/1tIDZgWBq0qdGpnaYUy5hws (如果鏈接失效,添加下方QQ獲取全套資料)

提取碼:vm8n

添加QQ:435946716,獲取課程配套筆記+源碼。

1第一天

01-Web APIs簡(jiǎn)介導(dǎo)讀

02-js基礎(chǔ)和Web APIs兩個(gè)階段的關(guān)聯(lián)性

03-API 和 Web API

04-DOM導(dǎo)讀

05-DOM簡(jiǎn)介

06-getElementById獲取元素

07-getElementsByTagName獲取某類標(biāo)簽元素

08-H5新增獲取元素方式

09-獲取body和html元素

10-事件三要素

11-執(zhí)行事件過程

12-操作元素-修改元素內(nèi)容

13-innerText和innerHTML的區(qū)別

14-操作元素-修改元素屬性

15-分時(shí)問候案例

16-操作元素-修改表單屬性

17-仿京東顯示隱藏密碼明文案例(上)

18-仿京東顯示隱藏密碼明文案例(下)

19-操作元素-修改樣式屬性

20-仿淘寶關(guān)閉二維碼案例

21-循環(huán)精靈圖

22-顯示隱藏文本框內(nèi)容

23-使用className修改樣式屬性

24-密碼框驗(yàn)證信息

25-操作元素總結(jié)以及作業(yè)

2第二天

01-排他思想(算法)

02-百度換膚效果

03-表格隔行變色效果

04-表單全選取消全選(上)

05-表單全選取消全選(下)

06-獲取自定義屬性值

07-設(shè)置移除自定義屬性

08-tab欄切換布局分析(重要)

09-tab欄切換制作(上)

10-tab欄切換制作(下)

11-H5自定義屬性

12-為什么學(xué)習(xí)節(jié)點(diǎn)操作以及節(jié)點(diǎn)簡(jiǎn)介

13-節(jié)點(diǎn)操作之父節(jié)點(diǎn)

14-節(jié)點(diǎn)操作之子節(jié)點(diǎn)

15-節(jié)點(diǎn)操作之第一個(gè)子元素和最后一個(gè)子元素

16-新浪下拉菜單

17-節(jié)點(diǎn)操作之兄弟節(jié)點(diǎn)

18-節(jié)點(diǎn)操作之創(chuàng)建和添加節(jié)點(diǎn)

19-簡(jiǎn)單版發(fā)布留言案例

3第三天

01-節(jié)點(diǎn)操作-刪除節(jié)點(diǎn)

02-刪除留言案例

03-節(jié)點(diǎn)操作-復(fù)制節(jié)點(diǎn)

04-動(dòng)態(tài)生成表格-創(chuàng)建學(xué)生數(shù)據(jù)

05-動(dòng)態(tài)生成表格-創(chuàng)建行

06-動(dòng)態(tài)生成表格-創(chuàng)建單元格

07-動(dòng)態(tài)生成表格-單元格填充數(shù)據(jù)

08-動(dòng)態(tài)生成表格-創(chuàng)建刪除單元格

09-動(dòng)態(tài)生成表格-添加刪除操作

10-document.write創(chuàng)建元素(了解)

11-innerHTML和createElement效率對(duì)比

12-DOM重點(diǎn)核心

13-事件高級(jí)導(dǎo)讀

14-注冊(cè)事件兩種方式

15-attachEvent注冊(cè)事件

16-刪除事件

17-DOM事件流理論

18-DOM事件流代碼驗(yàn)證

19-什么是事件對(duì)象

20-e.target和this區(qū)別

21-阻止默認(rèn)行為

22-阻止事件冒泡

23-事件委托

24-禁止選中文字和禁止右鍵菜單

25-獲得鼠標(biāo)在頁面中的坐標(biāo)

26-跟隨鼠標(biāo)的天使

4第四天

01-常用的鍵盤事件

02-keyCode判斷用戶按下哪個(gè)鍵

03-模擬京東按鍵輸入內(nèi)容案例

04-模擬京東快遞單號(hào)查詢(上)

05-模擬京東快遞單號(hào)查詢(下)

06-BOM導(dǎo)讀

07-BOM概述

09-頁面加載事件

10-調(diào)整窗口大小事件

11-定時(shí)器之setTimeout

12-回調(diào)函數(shù)以及5秒之后自動(dòng)關(guān)閉的廣告

13-清除定時(shí)器clearTimeout

14-定時(shí)器之setInterval

15-倒計(jì)時(shí)效果

16-清除定時(shí)器clearInterval

17-發(fā)送短信案例

18-this指向問題

19-js 同步和異步

20-同步任務(wù)和異步任務(wù)執(zhí)行過程

21-js執(zhí)行機(jī)制

22-location對(duì)象常見屬性

23-5秒鐘之后跳轉(zhuǎn)頁面

24-獲取URL參數(shù)

25-location常見方法

26-navigator對(duì)象

27-history對(duì)象

5第五天

01-PC端網(wǎng)頁特效異讀

02-offsetLeft和offsetTop獲取元素偏移

03-offsetWidth和offsetHeight獲取元素大小

04-offset與style區(qū)別

05-獲取鼠標(biāo)在盒子內(nèi)的坐標(biāo)

06-拖動(dòng)模態(tài)框(上)

07-拖動(dòng)模態(tài)框(中)

08-拖動(dòng)模態(tài)框(下)

09-仿京東放大鏡效果頁面結(jié)構(gòu)搭建

10-仿京東放大鏡效果顯示隱藏遮擋層和大盒子

11-仿京東放大鏡效果遮擋層跟隨鼠標(biāo)

12-仿京東放大鏡效果限制遮擋層移動(dòng)范圍

13-仿京東放大鏡效果大圖片移動(dòng)

14-client系列

15-立即執(zhí)行函數(shù)

16-淘寶flexibleJS源碼分析之核心原理

17-淘寶flexibleJS源碼分析之pageshow事件

18-scroll系列

19-仿淘寶固定側(cè)邊欄(上)

20-仿淘寶固定側(cè)邊欄(下)

21-三大系列總結(jié)

22-mouseover和mouseenter區(qū)別

23-動(dòng)畫原理

24-簡(jiǎn)單動(dòng)畫函數(shù)封裝

25-動(dòng)畫函數(shù)-給不同元素記錄不同定時(shí)器

6第六天

01-緩動(dòng)動(dòng)畫原理

02-緩動(dòng)動(dòng)畫基本代碼實(shí)現(xiàn)

03-緩動(dòng)動(dòng)畫多個(gè)目標(biāo)值之間移動(dòng)

04-緩動(dòng)動(dòng)畫添加回調(diào)函數(shù)

05-動(dòng)畫函數(shù)的使用

06-網(wǎng)頁輪播圖-結(jié)構(gòu)搭建

07-網(wǎng)頁輪播圖-鼠標(biāo)經(jīng)過顯示隱藏左右按鈕

08-網(wǎng)頁輪播圖-動(dòng)態(tài)生成小圓圈

09-網(wǎng)頁輪播圖-小圓圈排他思想

10-網(wǎng)頁輪播圖-點(diǎn)擊小圓圈滾動(dòng)圖片

11-網(wǎng)頁輪播圖-右側(cè)按鈕無縫滾動(dòng)

12-網(wǎng)頁輪播圖-克隆第一張圖片

13-網(wǎng)頁輪播圖小圓圈跟隨右側(cè)按鈕一起變化

14-網(wǎng)頁輪播圖-兩個(gè)小bug解決方案

15-網(wǎng)頁輪播圖-左側(cè)按鈕功能制作

16-網(wǎng)頁輪播圖-自動(dòng)播放功能

17-節(jié)流閥以及邏輯中斷應(yīng)用

18-帶有動(dòng)畫的返回頂部

19-筋斗云案例

20-移動(dòng)端網(wǎng)頁特效導(dǎo)讀

21-移動(dòng)端touch觸摸事件

22-移動(dòng)端TouchEvent觸摸事件對(duì)象

23-移動(dòng)端拖動(dòng)元素

7第七天

01-移動(dòng)端輪播圖-結(jié)構(gòu)搭建

02-移動(dòng)端輪播圖-布局分析

03-移動(dòng)端輪播圖-滾動(dòng)圖片

04-移動(dòng)端輪播圖-無縫滾動(dòng)

05-classList類名操作

06-移動(dòng)端輪播圖-小圓點(diǎn)跟隨變化

07-移動(dòng)端輪播圖-手指拖動(dòng)輪播圖

08-移動(dòng)端輪播圖-手指滑動(dòng)播放上一張下一張圖片

09-移動(dòng)端輪播圖-回彈效果

10-返回頂部模塊制作

11-移動(dòng)端click事件300ms延時(shí)問題解決方案

12-fastclick插件使用

13-swiper插件使用-引入相關(guān)文件

14-移動(dòng)端輪播圖-按照語法規(guī)范使用

15-swiper插件使用-參數(shù)更改

16-移動(dòng)端其他插件以及使用總結(jié)

17-視頻插件zy.media.js的使用

18-bootstrap輪播圖

19-阿里百秀輪播圖制作

20-本地存儲(chǔ)導(dǎo)讀

21-本地存儲(chǔ)之sessionStorage

22-本地存儲(chǔ)之localStorage

23-記住用戶名案例

點(diǎn)擊查看更多
分享到:
在線咨詢 我要報(bào)名
和我們?cè)诰€交談!