Die Geburt von Jquery erleichtert unseren Front-End-Neulingen die Bedienung von Webinteraktionen.
Heute gebe ich Ihnen einige Tipps zur Verwendung von JQuery.
jquery blockiert Standardverhalten des Browsers wie Hyperlinks.
$("a").click(function(event){
event.preventDefault();
});Jquery löst das Wagenrücklaufereignis aus
$(function () {
$('#target').bind('keyup', function (event) {
if (event.keyCode == 13) {
alert("Hello~");
}
});
});Den Wert von „select“ abrufen
jquery kann den Wert von „select“ abrufen, genau wie das Abrufen des Textfeldwerts: $ ('select' ).val();
Text kopieren
Verwenden Sie window.clipboardData.setData('text', text);
, um den Text einzufügen die Systemzwischenablage, um die Textkopierfunktion zu realisieren. Diese Methode wird jedoch nur vom IE unterstützt.
Weder Google Chrome noch Foxfire unterstützen es. Daher sollten Sie bei der Verwendung zunächst feststellen, ob der Browser dies unterstützt:
if (window.clipboardData) { window.clipboardData.setData('text', text); }Text auswählen
Für die Auswahl von Eingabe- oder Textbereichstexten bietet jquery eine einfache Funktion: select() , Beim Aufruf müssen Sie sicherstellen, dass das Textfeld sichtbar ist und den Fokus hat.
$("#txtSample").focus().select(); //现货的焦点，然后选择文本Mausereignisse
Mouseover und Mouseout, Mouseenter und Mouseleave; diese beiden Ereignisgruppen werden ausgelöst, wenn sich die Maus in ein Element hinein und aus diesem heraus bewegt Größter Unterschied zwischen ihnen Ja: Mouseover- und Mouseout-Blase Wenn sich die Maus zu ihren untergeordneten Elementen bewegt, wird das Ereignis ebenfalls ausgelöst,
, während Mouseenter und Mouseleave nicht blasen.
Dieser Unterschied ist sehr wichtig!
Erweiterung eines jQuery-Objekts
Erweitert ein Objekt mit einem oder mehreren anderen Objekten und gibt das erweiterte Objekt zurück. Dies ist die von jquery implementierte Vererbungsmethode. Beispiel:$.extend(target,prop1,propN)：
$.extend(settings, options);
var settings = $.extend({}, defaults, options);jQuery löscht Elemente im Array
Wie in Tipp 7 erwähnt, verwenden Sie die Methode $.grep(), um Elemente im Array zu löschen.
Der obige Code löscht das Element „b“ im Array.var array = ['a', 'b', 'c'];
$.grap(array, function(value, index){return value=='b';}, true);JQuery-Array-Verarbeitung
Traverse obj, wobei obj das zu durchlaufende Array oder Objekt ist; fn ist die Verarbeitungsfunktion und die optionalen Parameter sind Index und Inhalt, z. B. var fn = function(index, content){}; Wenn Sie den Durchlauf beenden müssen, geben Sie bitte false zurück, und andere Rückgabewerte werden ignoriert.$.each(obj, fn);
Mit dieser Methode können JSON-Datenobjekte verarbeitet werden.
Bestimmen Sie, ob das obj-Objekt im Array enthalten ist. Wenn es vorhanden ist, geben Sie -1 zurück zu einem anderen Array. array ist das Array, das konvertiert werden muss, und fn ist die Verarbeitungsfunktion. Der Rückgabewert dieser Methode ist ein neu verarbeitetes Array.$.inArray(obj, array);
$.map(array, fn);
$.merge(array1, array2);
$.unique(array);
invert optionaler Parameter; Die Funktion gibt die Elemente im Array zurück, die von der Filterfunktion als „true“ zurückgegeben werden. Wenn „invert“ wahr ist, wird die Menge der Elemente zurückgegeben, die von der Filterfunktion als „false“ zurückgegeben werden.
$.grep(array, fn, [invert]);
jQuery bietet einen Mechanismus zum Bereitstellen mehrerer Verarbeitungsfunktionen für Ereignisse eines Objekts. Nachdem wir eine Klickereignisverarbeitungsmethode hinzugefügt haben, können wir mit dem Hinzufügen fortfahren ohne vorherige Verarbeitungsmethoden zu überschreiben.
Entfernen Sie das gebundene Ereignisabonnement, wenn die Unbind-Methode aufgerufen wird:
$('#btn').click(fn); $('#btn').bind('click', fn);
Rufen Sie ein Element in der jQuery-Objektsammlung ab.
Rufen Sie es für die erhaltene Elementsammlung ab Das Element (angegeben durch den Index) kann mit der Methode eq oder get(n) oder der Indexnummer abgerufen werden. Beachten Sie, dass eq ein JQuery-Objekt zurückgibt, während get(n) und Index ein Dom-Elementobjekt zurückgeben. Für JQuery-Objekte können Sie nur JQuery-Methoden und für Dom-Objekte nur Dom-Methoden verwenden. Sie möchten beispielsweise den Inhalt des dritten
-Elements abrufen. Es gibt zwei Methoden:$('#btn').unbind(); //将会移除所有的事件订阅 $('#btn').unbind('click') //将会移除click事件的订阅
$("div").eq(2).html(); //调用jquery对象的方法
$("div").get(2).innerHTML; //调用dom的方法属性Intellisense in einer eigenständigen JS-Datei
Fügen Sie :/// am Anfang der JS-Datei hinzu: ///
$("div")[0]; //获取第一个Dom对象
$("div").get(0); //同样获取第一个Dom对象
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
