Front-end javascript advanced interview video notes-how to use the prototype of jquery, zeptor (3)

3-1 Start
Insert picture description here
Insert picture description here
3-2 The use of jQuery uses the
Insert picture description here
Insert picture description here $ selector to instance different objects.
When multiple instances can share a set of methods, it means that html and css methods are derived from the prototype of a function

Basic usage: Pass in a css selector through the $ function to select several dom elements

3-3 Practical application-Zepto-1
Insert picture description here
First get the slice method of the array, and then get all the dom
elements on the page, and filter by slice.call to become an array
Insert picture description here
Insert picture description here
Insert picture description here
Insert picture description here
Insert picture description here
selector. The selector is css dom. The
dom is the dom element selected by the selector.
A method of node's array form new Z constructor

First of all, we pass a selector into a $ function, and then transfer it to the zepto.init() function. After a bit of processing, this function turns the selector into a dom element and makes it into an array. It immediately transfers to zepto.Z() and passes A dom and a selector are created, and zepto.Z() receives the selector. At this time, the constructor Z appears. (Operation:
1. Assign the dom element to its own attributes.
2. Put the this of the dom into its own this.
3. Put the selector in your own selector)
and then his prototype is assigned to this object, this object has two methods, HTML and CSS, so these two methods can be used here.

3-6 Practical application-
Insert picture description here
Detailed analysis of the constructor and prototype in jQuery-1 JS
js has a deep understanding of the constructor and prototype objects

Features of the constructor:

a: The first letter of the constructor must be capitalized to distinguish it from ordinary functions

b: This object used internally to point to the instance object to be generated

c: Use New to generate instance objects

Insert picture description here
3-9 Extensibility-Plug-in mechanism.
Insert picture description here
Insert picture description here
Insert picture description here
GetNodeName extends an attribute
$.fn adds an additional attribute (css, html, getNodeName)
Insert picture description here
Insert picture description here
How to extend the plugin, and what work has been done behind it.

Guess you like

Origin blog.csdn.net/fengtingYan/article/details/101273759