Una dissezione di alto livello del codice pubblicato:
<script type="text/javascript">
Elemento HTML per incorporare uno script in esso
$("#circle")
$ è l'alias jQuery per ottenere l'oggetto jQuery che avvolge quasi tutte le cose che jQuery può fare. In questo caso invochiamo semplicemente l'oggetto jQuery con una sintassi simile a quella di un costruttore. Questa è una scorciatoia per "passare in un selettore css e restituire tutti gli elementi DOM corrispondenti avvolti come elementi jQuery". Quindi selezioniamo l'elemento nel DOM con id = circle
.click(
Questo è (uno dei tanti) modi jQuery per dire quando l'elemento (i) - il selettore precedente potrebbe aver restituito una tonnellata di elementi - viene cliccato esegui la funzione passata in me. Questa funzione è chiamata funzione di callback. Sostanzialmente sottoscrivendo l'evento onclick dell'elemento DOM.
function() {
.. il callback passato in ...
$("p")
Simile alla dichiarazione $ ("# circle") -. Seleziona tutti gli elementi del paragrafo nel DOM come elementi jQuery. ( <p></p> )
.html("You clicked the circle");
Per tutti gli elementi p selezionati in precedenza, l'html interno di questi elementi è "Hai fatto clic sul cerchio". Nota; Non dovresti quasi mai farlo per ragioni di sicurezza - usa invece .text ().
}
.. chiudi la chiamata ..
)
.. Menzione onorevole ; Hai dimenticato di chiudere la funzione click () - :) Il codice così com'è funziona comunque, dal momento che javascript è indulgente (nel bene o nel male, questa è un'altra storia)
</script>
.. chiudendo il tag script ..
Come è stato affermato, questa è una domanda molto ampia anche se non sembra. Per tutti i paragrafi precedenti potresti probabilmente scrivere una pagina di ciò che fa veramente sotto il cofano, ma questo è il succo di ciò.
Per la tua domanda "jQuery converte il codice risultante in JavaScript?" . Non proprio. jQuery è implementato in javascript, quindi puoi semplicemente pensarlo come una libreria di wrapper. jQuery ha due scopi principali: 1) Fornire un'API che funzioni indipendentemente dai tipi di browser. Quindi, ad esempio, se Safari ha qualche stranezza che funziona con l'evento onclick ma firefox segue le specifiche, jQuery si prenderà cura di questo sotto il cofano per te (non l'esempio di Safari / Firefox è puramente inventato, nessuno di questi dovrebbe avere capricci). E 2) fornire miglioramenti della QoL come i selettori CSS, anche se da allora sono stati implementati in ES5 o ES6, non ricordo quale. Quando uscì jQuery dovevi chiamare document.getElementById () o un metodo DOM simile per selezionare gli elementi.
A rischio di iniziare una guerra religiosa, jQuery oggigiorno ha ampiamente servito il suo scopo. La maggior parte delle cose che hanno reso popolare jQuery è ora implementata nelle recenti versioni di ECMAScript e la maggior parte dei browser è ora aggiornata per includere almeno le cose di base. Personalmente, lo uso solo perché è un'API familiare, dato che lavoravo spesso con esso, ma non è "necessario" per usarlo come una volta.
Spero che aiuti:)