Drei Anwendungsfälle von $() in jQuery

Dieses Mal werde ich Ihnen drei Anwendungsfälle der drei $() von jQuery vorstellen. Was sind die Vorsichtsmaßnahmen bei der Verwendung der drei Arten von $() von jQuery?

Das $-Zeichen ist ein Alias ​​für die jQuery-„Klasse“, und $() erstellt ein jQuery-Objekt. Daher kann „$()“ als Konstruktor von jQuery bezeichnet werden (persönliche Meinung, haha!).

1. $() kann $(Ausdruck) sein, also ein CSS-Selektor , ein Xpath- oder HTML-Element, das heißt, das Zielelement wird über den obigen Ausdruck abgeglichen.
Zum Beispiel: Das von $("a") erstellte Objekt verwendet einen CSS-Selektor, um ein jQuery-Objekt zu erstellen – es wählt alle -Tags aus. Beispiel:
$("a").click(function(){...})
ist ein Ereignis, das ausgelöst wird, wenn auf einen Link auf der Seite geklickt wird. Um genau zu sein, erstellt jQuery ein Objekt $("a") mit dem Tag und die Funktion click() ist eine (Ereignis-)Methode dieses jQuery-Objekts.
Zum Beispiel gibt es so einen HTML-Code:

<p>one</p> 
<p> 
<p>two</p> 
</p> 
<p>three</p> 
<a href="#" id="test" onClick="jq()" >jQuery</a>

Die Operation dieses HTML ist die folgende Anweisung:

alert($("p>p").html());

$() ist Ein Abfrageausdruck, das heißt, ein jQuery-Objekt wird unter Verwendung eines Abfrageausdrucks wie „p>p“ erstellt, und „html()“ bedeutet dann, seinen HTML-Inhalt anzuzeigen, bei dem es sich um die [zwei] der oben genannten HTML-Codeausschnitte handelt . Ein weiteres Beispiel:

$("<p><p>Hello</p></p>").appendTo("body");

$() enthält eine Zeichenfolge. Verwenden Sie eine solche Zeichenfolge, um ein jQuery-Objekt zu erstellen, und fügen Sie diese Zeichenfolge dann zu hinzu.
2. $() kann $(element) sein, was ein bestimmtes DOM-Element ist. Zu den häufig verwendeten DOM-Objekten gehören beispielsweise Dokumente, Speicherorte, Formulare usw. Zum Beispiel diese Codezeile:

$(document).find("p>p").html()); 
$()中的document是一个DOM元素，即在全文寻找带<p>的<p>元素，并显示<p>中的内容。

3 $() kann $(function) sein, also eine Funktion, die eine Abkürzung für $(document).ready() ist. . Die übliche Form sieht beispielsweise so aus:

$(document).ready(function(){ 
alert("Hello world!"); 
});

Variablenoperation:

$(function(){ 
alert("Hello world!"); 
});

Für die Auswahl von Elementen in HTML-Dokumenten verfügt jQuery über zwei Methoden:
1) Wie $("p>ul a") bedeutet dies, dass das a-Tag im ul-Tag im p-Tag ist
Jedoch $('p>ul') und $('p ul' ) ist anders,

$(&#39;p>ul&#39;)是<p>的直接后代里找<ul>； 
而$(&#39;p ul&#39;)是在<p>的所有后代里找<ul>。

2) Verwenden Sie mehrere Methoden von jQuery-Objekten (z. B. Methoden find(), every() usw.)
$("#orderedlist).find ( „li“) ist wie $(„#orderedlist li“) und iteriert alle li, und das „#“ im Ausdruck stellt die ID in HTML dar, wie etwa „#orderedlist“ im obigen Beispiel ist das Tag, in dem sich die bestellte Liste befindet"
******************************************* *. ******************************
1, Tag-Selektor $('p' ), Der Klassenselektor $('.myClass') und der ID-Selektor $('#myId') sind relativ einfach, es gibt nicht viel zu sagen, aber eines gibt es - $('p>ul ') und $('p ul') ist unterschiedlich,
$('p>ul') soll unter den direkten Nachkommen von

; ') soll alle Nachkommen von

finden.
Daher wählt $('#sId>li') alle untergeordneten Knoten mit der ID „sId“ aus Nachkommen dieses

haben auch nicht den gesuchten Bereich (das gefundene DOM-Objekt ist nur das DOM-Objekt seiner eigenen Ebene.) )') bezieht sich auf den Klassennamen „sId“. Unter allen Nachkommen von li gibt es keine Elemente der horizontalen Klasse.
Was hier zurückgegeben wird, ist ein jQurey-Objekt , ein Array-Objekt, und die Länge dieses jQuery-Objekts wird ermittelt
2. Zum Beispiel: Um alle Links mit dem Titelattribut auszuwählen, schreiben wir so: $ ('a[@title]')
[] mit @, Beschreibung [] ist das Attribut des Elements; es ist ein
Attributselektor [] hat kein @, was darauf hinweist [] ist der Nachkomme der Elemente
$('ul li') und $ ('ul[li]'). Obwohl beide ein jQuery-Array zurückgeben, sind die Bedeutungen der beiden genau entgegengesetzt. Ersteres dient dazu, alle Nachkommen von

unter

zu finden, während Letzteres darin besteht, das Array
zu finden.
Wenn Sie in XPath ein Attribut suchen möchten, das mit „beginnt“, verwenden Sie ^=. Wenn Sie ein Eingabeelement finden möchten, dessen Namensattribut mit „mail“ beginnt, verwenden Sie
$('input[@. name^ ="mail"]')
Um ein Attribut zu finden, das „endet mit...“, verwenden Sie $=
Um ein Attribut zu finden, das weder Anfang noch Ende hat, verwenden Sie *=
3. Selektoren, die nicht zum oben genannten CSS und XPath gehören, sind benutzerdefinierte Selektoren, dargestellt durch „:“. Hier wird Folgendes verwendet:



first，:last，:parent ，:hidden，:visible，:odd，:even，:not('xxx')， ":eq(0)"（始于0)，:nth(n），:gt(0)，:lt(0)，:contains("xxx")

如：$('tr:not([th]):even')意为元素的子孙中不含的所有子孙的偶数项
4、还有几个，简单不解释了


$('th').parent()—— 
$(&#39;td:contains("Henry")&#39;).prev()——内容包含有"Henry"的<td>的上一个节点 
$(&#39;td:contains("Henry")&#39;).next()——内容包含有"Henry"的<td>的下一个节点 
$(&#39;td:contains("Henry")&#39;).siblings()——内容包含有"Henry"的<td>的所有兄弟节点

还有一个，就是end()，这个方法肯定是用在某个DOM节点执行了某一动作之后，还想在与其相关的节点上执行类似动作，这里就要用到end()。用过end()方法之后，所返回的是执行动作的那个节点的父节点上。举个例子


$(...).parent().find(...).addClass().end()

这里执行动作的节点是find(...)，是一个数组对象，它所做的动作是“addClass()”，之后，用了个end()，这时所返回的东东就是指向了parent()所指向的节点，也就是执行“addClass()”动作的那个数组对象的父节点。
5、要直接访问DOM元素，可用get(0)的方法，如


$('#myelement').get(0)，也可缩写成$('#myelement')[0]

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

js仿jquery步骤详解


JS中时间单位比较的方法


Das obige ist der detaillierte Inhalt vonDrei Anwendungsfälle von $() in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!