In diesem Artikel erfahren Sie, wie Sie die Funktion $() in jQuery verwenden. Ich hoffe, dass er allen helfen kann.
Wenn wir jQuery verwenden, verwenden wir im Allgemeinen immer $() und $ zeigt auf das globale jQuery, also rufen wir tatsächlich jQuery() auf Das Ergebnis ist ein zurückgegebenes jq-Objekt, aber wir müssen new nicht verwenden, um das Objekt zu erstellen, wenn wir es verwenden, sodass wir spekulieren können, dass $() eine Factory-Funktion ist. Die Definition von
jQuery() ist in src/core.js definiert. Wenn return new jQuery() in dieser Methode aufgerufen wird, fällt es in eine Schleife, also ist init() aufgerufen, um beim Aufbau der Instanz zu helfen. Es ist erwähnenswert, dass jQuery.fn auf /src/core.js in jQuery.prototype verweist.
// Define a local copy of jQuery
jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
// Need init if jQuery is called (just allow error to be thrown if not included)
return new jQuery.fn.init( selector, context );
}jQuery.fn.init() ist in src/core/init.js definiert. Die Methode akzeptiert drei Parameter selector, context, root. Bestimmen Sie innerhalb der Methode zunächst, ob Parameter vorhanden sind, und geben Sie false zurück, wenn keine Parameter vorhanden sind.
init = jQuery.fn.init = function( selector, context, root ) {
var match, elem;
// HANDLE: $(""), $(null), $(undefined), $(false)
if ( !selector ) {
return this;
}
// Method init() accepts an alternate rootjQuery
// so migrate can support jQuery.sub (gh-2101)
root = root || rootjQuery;
// Handle HTML strings
// < xxx > 或 $(#id)
if ( typeof selector === "string" ) {
if ( selector[ 0 ] === "<" &&
selector[ selector.length - 1 ] === ">" &&
selector.length >= 3 ) {
// Assume that strings that start and end with <> are HTML and skip the regex check
match = [ null, selector, null ];
} else {
// match[1]是html字符串，match[2]是匹配元素的id
// selector是id选择器时match[1]为undefined，match[2]是匹配元素的id
// selector是html字符串，match[1]是html字符串，match[2]为undefined
match = rquickExpr.exec( selector );
}
// Match html or make sure no context is specified for #id
// 匹配结果非空 且 存在匹配字符串或context空时执行
// 未为id选择器限定查找范围
if ( match && ( match[ 1 ] || !context ) ) {
// HANDLE: $(html) -> $(array)
if ( match[ 1 ] ) {
context = context instanceof jQuery ? context[ 0 ] : context;
// Option to run scripts is true for back-compat
// Intentionally let the error be thrown if parseHTML is not present
// 生成dom节点并合并到this上
jQuery.merge( this, jQuery.parseHTML(
match[ 1 ],
context && context.nodeType ? context.ownerDocument || context : document,
true
) );
// HANDLE: $(html, props)
// 遍历props，添加属性或方法
if ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) {
for ( match in context ) {
// Properties of context are called as methods if possible
if ( jQuery.isFunction( this[ match ] ) ) {
this[ match ]( context[ match ] );
// ...and otherwise set as attributes
} else {
this.attr( match, context[ match ] );
}
}
}
return this;
// HANDLE: $(#id)
// 处理id选择器且无context
} else {
elem = document.getElementById( match[ 2 ] );
if ( elem ) {
// Inject the element directly into the jQuery object
this[ 0 ] = elem;
this.length = 1;
}
return this;
}
// HANDLE: $(expr, $(...))
// selector是选择器 context为undefined或context.jquery存在时执行。
// $(#id,context)或$(.class [, context])等情况
} else if ( !context || context.jquery ) {
return ( context || root ).find( selector );
// HANDLE: $(expr, context)
// (which is just equivalent to: $(context).find(expr)
} else {
return this.constructor( context ).find( selector );
}
// HANDLE: $(DOMElement)
// 传入DOM元素
} else if ( selector.nodeType ) {
this[ 0 ] = selector;
this.length = 1;
return this;
// HANDLE: $(function)
// Shortcut for document ready
} else if ( jQuery.isFunction( selector ) ) {
return root.ready !== undefined ?
root.ready( selector ) :
// Execute immediately if ready is not present
selector( jQuery );
}
return jQuery.makeArray( selector, this );
};Wenn ein selector nicht leer ist, behandeln Sie zunächst den Fall, in dem selector eine Zeichenfolge ist, die in die HTML-Zeichenfolge $(selector) und und $(expr, $(...))Vier Arten. Wenn $(expr, context) ein Zeichenfolgentyp ist, wird der generierte Dom-Knoten basierend auf der eingehenden Zeichenfolge zurückgegeben. Verwenden Sie während der Verarbeitung zunächst den regulären Abgleich, um die HTML-Zeichenfolge oder -ID zu finden. Wenn das Übereinstimmungsergebnis nicht leer ist und eine übereinstimmende Zeichenfolge vorhanden ist oder der Kontext leer ist, bedeutet dies, dass selector eine HTML-Zeichenfolge oder selctor ein ID-Selektor ist und der Suchkontext nicht eingeschränkt ist. Bestimmen Sie bei der Verarbeitung von HTML-Zeichenfolgen zunächst, in welches Dokument der generierte Knoten eingefügt werden soll (d. h. der Parameter selector). Standardmäßig wird das jQuery-Dokument geladen, context aufgerufen, um einen Dom-Knoten zu generieren und hinzuzufügen $.parseHTML(); wenn this ein Objekt ist, dann ist es der Aufruf von context, der die Attribute oder Methoden an den Dom anhängt und das generierte jq-Objekt zurückgibt. Wenn der Aufruf von $(html, props) übereinstimmt und $(#id) leer ist, wird context direkt aufgerufen, um das Element zu finden. Wenn das Element vorhanden ist, zeigt document.getElementById auf das Element und das Suchergebnis wird zurückgegeben. this[0]
kein ID-Selektor ist oder selector nicht leer ist, rufen Sie context auf, um zu suchen. Wenn find nicht leer ist, starten Sie die Suche von context und finden Sie die Ergebnisse als Rückgabewert. context
auf das Dom-Element, setzen Sie die JQ-Objektlänge auf 1 und geben Sie this[0] zurück. this
schließlich verarbeitet. Wenn $(function(){}) vorhanden ist, wird die eingehende Funktion ready aufgerufen. Andernfalls wird jQuery übergeben und die Funktion wird direkt aufgerufen , Aufruf von ready(f()). Verwenden Sie das Ergebnis als Rückgabewert. makeArray
init = jQuery.fn.init = function( selector, context, root ) {
...
}
// Give the init function the jQuery prototype for later instantiation
init.prototype = jQuery.fn; und verweisen Sie dann den Prototyp von init auf den Prototyp von jQuery Die erstellte Instanz ist init, nicht init.prototype, sondern eine Instanz von init und nicht eine Instanz von jQuery. Verschiedene Variablen und Methoden, die auf jQuery.fn in core.js definiert sind, können nicht aufgerufen werden. jQuery.fn
So fordern Sie den Download einer Execl-Datei über Ajax an
Verwenden Sie Slice zum Kapseln Arrays in der JS-Methode
Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Funktion $() in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
