Introduction to Web APIs
00 minutes56 secondsThe relationship between the two stages of js basics and Web APIs
03 minutes46 secondsAPIJapan Web API
05 minutes06 secondsIntroduction to DOM
01 minutes05 secondsIntroduction to DOM
04 minutes54 secondsgetElementById gets the element
08 minutes16 secondsgetElementsByTagName Gets a certain type of tag element
11 minutes31 secondsH5 adds new way to obtain elements
08 minutes35 secondsGet body and html elements
02 minutes58 secondsthree elements of event
06 minutes39 secondsExecute event process
04 minutes05 secondsManipulate elements - modify element content
08 minutes16 secondsThe difference between innerText and innerHTML
06 minutes04 secondsManipulate elements - modify element attributes
05 minutes53 secondsTime-sharing greeting case
06 minutes14 secondsOperation element-modify form attributes
06 minutes46 secondsExample of imitating JD.com to display hidden passwords in clear text (Part 1)
07 minutes23 secondsExample of imitating JD.com to display hidden passwords in clear text (Part 2)
08 minutes06 secondsManipulate elements - modify style attributes
05 minutes16 secondsCase of imitation Taobao closing QR code
05 minutes17 secondsLooping sprites
08 minutes55 secondsShow hidden text box content
10 minutes04 secondsUse className to modify style attributes
09 minutes28 secondsPassword box verification information
09 minutes42 secondsSummary of operational elements and assignments
03 minutes43 secondsExclusive thinking (algorithm)
09 minutes14 secondsBaidu skin resurfacing effect
08 minutes19 secondsColor changing effect of table rows
07 minutes26 secondsForm Select All-Cancel Select All (Part 1)
07 minutes33 secondsForm Select All-Cancel Select All (Part 2)
09 minutes26 secondsGet custom attribute value
05 minutes04 secondsSet remove custom properties
04 minutes54 secondsTab bar switching layout analysis (important)
04 minutes18 secondsTab bar switching production (Part 1)
04 minutes10 secondsTab bar switching production (Part 2)
09 minutes18 secondsH5 custom attributes
10 minutes27 secondsWhy learn node operations and node introduction
07 minutes03 secondsThe parent node of the node operation
04 minutes15 secondsChild node of node operation
06 minutes05 secondsNode operation first child element and last child element
06 minutes44 secondsSina drop down menu
06 minutes31 secondsNode operation's sibling node
05 minutes15 secondsNode operations: create and add nodes
08 minutes10 secondsSimple version of posting message case
08 minutes51 secondsNode operation-delete node
05 minutes23 secondsDelete message case
08 minutes14 secondsNode operation-copy node
04 minutes57 secondsDynamically generate tables - create student data
05 minutes44 secondsDynamically generate tables - create rows
03 minutes44 secondsDynamically generate tables - create cells
05 minutes04 secondsDynamically generate tables - fill cells with data
03 minutes06 secondsDynamically generate tables - create and delete cells
03 minutes09 secondsDynamically generate tables - add and delete operations
04 minutes11 secondsdocument.write creates elements
04 minutes54 secondsComparison of efficiency between innerHTML and createElement
07 minutes51 secondsDOM key core
06 minutes05 secondsAdvanced guide to events
01 minutes16 secondsTwo ways to register events
08 minutes26 secondsattachEvent registration event
05 minutes22 secondsdelete event
08 minutes18 secondsDOM event flow theory
04 minutes39 secondsDOM event flow code verification
07 minutes51 secondsWhat is an event object
08 minutes05 secondsThe difference between e.target and this
08 minutes31 secondsBlock default behavior
06 minutes33 secondsPrevent events from bubbling up
04 minutes41 secondsevent delegation
06 minutes35 secondsDisable text selection and right-click menu
04 minutes36 secondsGet the coordinates of the mouse on the page
07 minutes28 secondsAngel following the mouse
07 minutes43 secondsCommonly used keyboard events
07 minutes02 secondskeyCode determines which key the user pressed
07 minutes30 secondsCase study of simulating JD key input content
05 minutes17 secondsSimulate Jingdong express tracking number inquiry (Part 1)
06 minutes59 secondsSimulate Jingdong express tracking number inquiry (Part 2)
06 minutes02 secondsBOM introduction
00 minutes57 secondsBOM overview
08 minutes41 secondspage load event
08 minutes23 secondswindow resize event
05 minutes29 secondsTimer setTimeout
07 minutes16 secondsCallback function and ads that automatically close after 5 seconds
03 minutes59 secondsclear timer
03 minutes02 secondsTimer setInterval
03 minutes33 secondsCountdown effect
08 minutes12 secondsclear timer
04 minutes45 secondsSend SMS case
07 minutes50 secondsthis points to the problem
07 minutes55 secondsjs sync and asynchronous
04 minutes52 secondsSynchronous task and asynchronous task execution process
06 minutes28 secondsjs execution mechanism
06 minutes49 secondsCommon properties of location objects
06 minutes03 secondsJump to the page after 5 seconds
06 minutes15 secondsGet URL parameters
11 minutes02 secondsCommon methods of location
04 minutes12 secondsnavigator object
04 minutes50 secondshistory object
04 minutes30 secondsPC web page special effects reading
01 minutes06 secondsoffsetLeft and offsetTop get the element offset
04 minutes49 secondsoffsetWidth and offsetHeight get the element size
05 minutes09 secondsThe difference between offset and style
03 minutes41 secondsGet the coordinates of the mouse inside the box
06 minutes03 secondsDrag modal box (top)
06 minutes06 secondsDrag modal box (middle)
09 minutes55 secondsDrag the modal box (below)
02 minutes49 secondsBuilding a page structure that imitates Jingdong’s magnifying glass effect
06 minutes49 secondsImitation Jingdong magnifying glass effect showing hidden occlusion layer and big box
05 minutes37 secondsImitation Jingdong magnifying glass effect occlusion layer follows the mouse
08 minutes28 secondsJingdong magnifying glass imitation effect limits the movement range of the occlusion layer
07 minutes00 secondsImitation Jingdong magnifying glass effect large picture movement
08 minutes37 secondsclient series
02 minutes31 secondsExecute function immediately
08 minutes11 secondsThe core principles of Taobao flexibleJS source code analysis
07 minutes28 secondsTaobao flexibleJS source code analysis pageshow event
06 minutes58 secondsscroll series
05 minutes25 secondsImitation Taobao fixed sidebar (Part 1)
08 minutes09 secondsImitation Taobao fixed sidebar (below)
10 minutes37 secondsSummary of three major series
01 minutes56 secondsThe difference between mouseover and mouseenter
02 minutes56 secondsAnimation principles
06 minutes55 secondsSimple animation function encapsulation
04 minutes33 secondsAnimation function - record different timers for different elements
08 minutes11 secondsPrinciple of easing animation
05 minutes43 secondsBasic code implementation of easing animation
04 minutes37 secondsEasing animation to move between multiple target values
07 minutes23 secondsAdd callback function for easing animation
05 minutes54 secondsUse of animation functions
08 minutes31 secondsWeb page carousel diagram-structure construction
06 minutes40 secondsWeb page carousel - display and hide the left and right buttons when the mouse passes
06 minutes58 secondsWeb page carousel-dynamically generated small circles
07 minutes36 secondsWeb page carousel chart-small circle exclusive thought
03 minutes26 secondsWeb page carousel - click on the small circle to scroll through the images
10 minutes02 secondsWeb page carousel - seamless scrolling with buttons on the right
11 minutes13 secondsWeb page carousel - clone the first picture
03 minutes52 secondsThe small circle of the web page carousel changes with the button on the right
05 minutes12 secondsWeb page carousel-two small bug solutions
05 minutes53 secondsWeb page carousel-button function on the left
07 minutes12 secondsWeb page carousel-auto play function
04 minutes36 secondsThrottle valve and logic interrupt application
07 minutes39 secondsReturn to top with animation
10 minutes08 secondsSomersault cloud case
10 minutes15 secondsIntroduction to mobile website special effects
01 minutes15 secondsMobile touch event
04 minutes29 secondsMobile TouchEvent touch event object
11 minutes00 secondsDrag elements on mobile
10 minutes06 secondsMobile terminal carousel chart-structure construction
05 minutes55 secondsMobile Carousel Chart-Layout Analysis
07 minutes46 secondsMobile carousel-scrolling pictures
08 minutes02 secondsMobile carousel-seamless scrolling
08 minutes34 secondsclassList class name operation
08 minutes10 secondsMobile carousel chart - small dots follow changes
05 minutes07 secondsCarousel chart on mobile terminal - drag carousel chart with finger
07 minutes46 secondsMobile carousel - slide your finger to slide the carousel to the previous and next pictures
07 minutes35 secondsMobile carousel image-rebound effect
05 minutes39 secondsBack to topTemplate making
07 minutes14 secondsSolution to the 300ms delay problem of click events on mobile terminals
05 minutes53 secondsFastclick plug-in usage
06 minutes45 secondsUsing swioper plug-in - introducing related files
06 minutes44 secondsMobile carousel image - used according to grammar specifications
07 minutes01 secondsswiper plug-in usage-parameter change
04 minutes07 secondsOther mobile plug-ins and usage summary
03 minutes23 secondsUse of video plug-in zy.media.js
07 minutes53 secondsbootstrap carousel
10 minutes33 secondsAlibaba 100 show carousel picture production
09 minutes43 secondsLocal storage guide
00 minutes49 secondsLocal storage sessionStrage
11 minutes50 secondslocal storage localStorage
05 minutes25 secondsRemember username case
05 minutes53 seconds
In this set of courses, we will explain how to obtain DOM elements, how to operate DOM elements, BOM operations, events, event objects, event delegation, JS execution queues, timers, and common web page special effects, such as carousels, tab bar switching, etc. It will also explain how to create web page special effects on the mobile terminal and take you into the actual development and application of JavaScript.
