Oltre 50 domande e risposte alle interviste jQuery più comuni (aggiornato al 2021)

Il risultato della chiamata al metodo precedente è uno sfondo giallo sugli elementi A, B, 1, 2, 3 e C come mostrato nell'immagine sottostante.

Il metodo .find () seleziona tutti gli elementi figlio dell'elemento DOM che viene attraversato.

Sintassi nell'API jQuery .children () con cui individuare l'elemento

tag con classe 'livello 2'.
$( 'ul.level-2' ).children().css( 'background-color', 'yellow' );

Il risultato della chiamata al metodo precedente è uno sfondo giallo sugli elementi A, B e C come mostrato nell'immagine sottostante.



Il metodo .children () seleziona gli elementi a livello singolo dell'elemento DOM che viene attraversato.

D # 14) Spiega i vari tipi di selettori e la loro funzionalità in jQuery.

Risposta: I selettori jQuery vengono utilizzati per individuare / selezionare elementi HTML dalla gerarchia DOM in base ai loro attributi come elencato di seguito.

• nome
• id
• classe
• genere
• valori

I tipi di selettore di base sono:

• Nome
• ID
• Nome della classe
• Selettore universale come *, che seleziona tutti gli elementi in un DOM.
• Più elementi. Esempio:
• ,

  ,.

• Selettore di attributi, Esempio: identificare / selezionare gli elementi in base ai loro attributi come il colore, lo stile del carattere o il colore di sfondo.

Di seguito viene spiegato un esempio di più elementi e selettori di attributi in jQuery.



Nel codice jQuery sopra, l'attributo class è un selettore e il colore del carattere del testo all'interno dell'elemento tag HTML è cambiato in verde. Questo codice influenzerà / cambierà il colore del carattere dei testi all'interno di tutti quegli elementi che hanno attributi di classe.

D # 15) Differenziare tra l'ID e il selettore di classe in jQuery.

Risposta: Ogni elemento HTML può avere un solo ID, in altre parole, un elemento può essere identificato con un ID univoco, mentre puoi utilizzare la stessa classe su più elementi.

Esempio di selettore ID in jQuery per nascondere un elemento DOM con un ID come attributo, ad esempio elemento con un ID come 'gold_coin'

$('#gold_coin').hide();

Se vuoi nascondere, dì tutti i link la cui classe è 'grezza',

$('a.raw').hide();

D # 16) Spiega i vantaggi dei metodi jQuery Ajax.

Risposta: Ajax può richiedere e ricevere dati dal server senza ricaricare la pagina con l'aiuto di DOM e JavaScript.

I vantaggi dell'utilizzo dei metodi Ajax in jQuery sono elencati di seguito:

come aprire il file chiave in Windows

• Ci consente di ricaricare l'intera pagina e ci dà la flessibilità di caricare solo una parte della pagina.
• API semplice.
• Supporto cross-browser.
• GET e POST supportati.
• Carica un documento JSON, XML, HTML o script.

D # 17) Distinguere tra i metodi jQuery onload () e document.ready ().

Risposta: La differenza tra i metodi onload () e document.ready () è che il metodo onload () di JavaScript verrà chiamato solo dopo che tutti gli oggetti nel documento web saranno stati completamente visualizzati / caricati.

Mentre il metodo document.ready () viene chiamato quando la struttura DOM viene caricata nei documenti. Il metodo document.ready () viene chiamato molto velocemente rispetto al metodo onload (), poiché il secondo attende che le immagini siano completamente visualizzate.

D # 18) Spiega la funzionalità del metodo connect () di jQuery.

Risposta: jQuery connect () è un plugin che viene utilizzato per connettere / legare una funzione a un'altra funzione assegnando un gestore. Possiamo usare un evento di un elemento DOM usando questa funzione.

D # 19) Spiega brevemente il bootstrap e il plug-in JavaScript.

Risposta: Bootstrap è un framework o un set di strumenti che include HTML, CSS e JavaScript per creare una pagina web o un'applicazione web. Molti dei componenti Bootstrap richiedono plugin Javascript per funzionare.

D # 20) Spiega le applicazioni per jQuery Mobile.

Risposta: jQuery Mobile è un framework compatibile cross-browser open source progettato per creare applicazioni mobili accessibili su tutti gli smartphone, tablet e dispositivi desktop.

jQuery Mobile è creato su jQuery e l'interfaccia utente di jQuery per il rendering di vari effetti speciali, la gestione di richieste / risposte Ajax, eventi di tocco, insieme a una varietà di widget.

D # 21) Differenzia tra jquery.min.js e jquery.js

Risposta: jquery.min.js e jquery.js hanno la stessa funzionalità, jquery.min.js ha tutti gli spazi vuoti rimossi per ridurre le dimensioni del file e velocizzarne il caricamento con conseguente esecuzione dello script.

Avere file JS minimizzati in un ambiente di produzione significa che verranno caricati più velocemente e offriranno prestazioni di pagina migliori e veloci.

D # 22) Spiegare la possibilità del metodo jQuery HTML per documenti HTML e XML.

Risposta: Il metodo jQuery HTML non è disponibile sui documenti XML, funziona solo per i documenti HTML.

D # 23) Spiegare la funzionalità di jQuery UI (interfaccia utente).

Risposta: jQuery UI è una libreria jQuery, che fornisce la creazione di vari oggetti dell'interfaccia utente come più elenchi di record in cui gli utenti possono selezionare, ordinare, trascinare, rilasciare e ridimensionare particolari elementi DOM.

La libreria dell'interfaccia utente crea anche widget integrati come completamento automatico, casella di controllo, pulsanti di opzione, datepicker, menu, ecc., Oltre ad aggiungere un effetto nascondi, mostra o attiva / disattiva e altre animazioni.

D # 24) Spiegare la funzionalità di un plug-in Data Table per jQuery.

Risposta: Data Table è un plug-in jQuery che, se applicato ai record, viene visualizzato in forma tabulare.

Possiamo ordinare i dati su una o più colonne, cercare il record specifico, aggiungere impaginazione, record per pagina e navigare tra i record in una tabella. La tabella dati può essere applicata a dati statici, array, dati in JSON e risposta AJAX.

D # 25) Spiega i vantaggi dell'hosting di un jQuery da CDN.

Risposta: L'hosting di jQuery dalla Content Delivery Network (CDN) aiuta ad alta disponibilità e alte prestazioni a un costo inferiore e basso carico di rete, latenza migliorata (è necessario meno tempo per inviare e ricevere un pacchetto di dati dal server), offrire una versione specifica del dispositivo di contenuti.

Esempio: Reattività per le dimensioni dello schermo del cellulare e capacità di archiviazione protetta per dati o file sensibili.

D # 26) Identifica qualsiasi differenza tra .detach () e .remove () di jQuery.

Risposta: Il metodo detach () di jQuery rimuove l'elemento selezionato, tuttavia conserva i dati e gli eventi. Il metodo .remove () di jQuery rimuove elementi, dati e eventi.

D # 27) Posso usare una libreria jQuery per lo scripting del server?

Risposta: jQuery è una libreria Javascript di scripting lato client. Non può essere utilizzato per lo scripting lato server.

D # 28) Puoi fornire alcune situazioni o scenari per l'utilizzo di jQuery?

Risposta:

Possiamo usare jQuery nelle seguenti situazioni / scenari:

• Possiamo applicare una funzione jQuery che può modificare la proprietà statica o dinamica CSS.
• Possiamo chiamare funzioni su eventi come eventi modulo, eventi tastiera, eventi mouse, eventi browser con l'aiuto di jQuery.
• Possiamo manipolare (aggiungere, modificare o eliminare) elementi DOM usando jQuery.
• jQuery può essere utilizzato per effetti di animazione sull'elemento HTML cambiando gradualmente la sua posizione statica in un'altra posizione.

D # 29) Elenca i quattro parametri utilizzati per il metodo jQuery Ajax.

Risposta: Indirizzo URL a cui viene inviata la richiesta, Tipo di richiesta GET o POST, Dati / contenuto da inviare al server e condizione affinché il browser consenta o meno la cache della pagina richiesta sono i quattro parametri utilizzati per il metodo jQuery Ajax.

D # 30) Spiega la funzionalità del filtro jQuery.

Risposta: .filter () in jQuery controllerà l'elemento corrispondente e l'attributo può essere aggiunto all'elemento corrispondente.

Ad esempio, per .filter (), può essere come indicato di seguito.



La riga di codice nell'API jQuery.filter () per individuare / filtrare gli elementi dell'elenco è la seguente.

$( 'li' ).filter( ':even' ).css( 'background-color', 'yellow' );

Il risultato della chiamata al metodo sopra è uno sfondo giallo per i testi Fisica, Matematica, Storia, Francese, ecc. Che è all'indice 0, 2, 4 e così via, (ricorda che l'indice inizia da 0, quindi 0 è pari) come mostrato nell'immagine sotto.



D # 31) Quale carattere speciale viene utilizzato come scorciatoia per jQuery?

Risposta: $ viene utilizzato al posto di jQuery,

Esempio: jQuery (document) .ready (function (); può essere usato come $ (document) .ready (function ()

D # 32) Spiega i diversi modi in cui possiamo eseguire il debug di jQuery.

Risposta: Ci sono alcuni modi in cui possiamo eseguire il debug del codice jQuery.

I browser moderni come Google Chrome, Mozilla Firefox, Opera e Safari hanno un debugger Javascript integrato. Per eseguire il debug del codice jQuery, premere F12 dalla tastiera e il browser con il debugger integrato aprirà un'interfaccia utente, in cui selezionare il menu 'Console'. L'errore verrà visualizzato nel menu della console, se presente.

Puoi scrivere console.log () nel codice per ottenere il testo dell'errore, puoi anche scrivere debugger; tra la riga di codice, a causa del debugger lo script inizierà in modalità debug, premendo F12 nel browser si aprirà la console che eseguirà il debug del codice, premendo F10 leggerà i valori degli oggetti jQuery, ed è così che possiamo eseguire il debug del codice jQuery .

D # 33) Spiega i possibili modi in cui possiamo includere jQuery in una pagina.

Risposta: È possibile scaricare la versione di produzione compressa jquery-3.4.1.min.js dal sito https://jquery.com/download/ e salvarla nella cartella lib nella cartella del progetto.

io) Possiamo fare riferimento a jquery dalla cartella locale in project / lib / Scripts come di seguito.

ii) Possiamo fare riferimento da siti della rete di distribuzione di contenuti come Microsoft CDN come di seguito.

D # 34) Spiega la funzionalità del metodo .each () in jQuery.

Risposta: jQuery .each () viene utilizzato per iterare / elencare l'elemento DOM presente nell'oggetto jQuery.

Esempio

var veg_list = { Onion, Capsicum, Sweet Potato, Cauliflower, Bitter Gourd, Brinjal }; $.each(veg_list, function (index, value) { console.log(value); }); // displays output as Onion Capsicum Sweet Potato, Cauliflower Bitter Gourd Brinjal

D # 35) Differenzia tra i metodi .prop () e .attr () di jQuery.

Risposta: Di seguito è riportata la differenza tra .prop () e .attr ().

Esempio:



Il codice jQuery contiene il metodo attr () che modifica i valori degli attributi di un'immagine come mostrato di seguito.



Il metodo .attr () di jQuery cambia attributi come larghezza e bordo dell'immagine.

$ (selettore) .attr (attributo dell'elemento, valore in cui vengono modificati gli attributi).

Il metodo .prop () in jQuery viene utilizzato per restituire e modificare le proprietà DOM come lo stato verificato, selezionato o disabilitato.

Pink


Per il tipo di input come casella di controllo, il valore è rosa e la proprietà DOM è selezionata,



Il codice jQuery contiene il metodo prop () che modifica la proprietà di visualizzazione di un elemento.



Il metodo .attr () ci aiuta a selezionare un valore che è 'rosa' qui, mentre il metodo .prop () seleziona la proprietà che è 'controllata' qui.

D # 36) Spiega la funzionalità di jQuery.noConflict.

Risposta: Il metodo noConflict () di jQuery viene applicato per risolvere i conflitti quando è necessario utilizzare framework diversi da jQuery.

Per esempio, molte librerie JavaScript come Mootools, prototype, zepto, ecc. utilizzano $, un nome di funzione o variabile, che viene utilizzato come sostituzione del testo jQuery nel codice jQuery, e in questi casi, il metodo .noConflict () consente di utilizzare $ identificatore di collegamento, consentendo ad altri script di utilizzarlo.

D # 37) Differenzia tra width () e css ('width') in jQuery.

Risposta: Esistono due metodi diversi in jQuery per modificare la larghezza di un elemento. Il primo modo è usare .css (proprietà) e l'altro è usare .property ().

Esempio:

$(selector).css(property,value_change); $(selector).property(value_change);

In .css (proprietà) che in questo caso è larghezza, dobbiamo aggiungere px in value_change, diciamo 300px.

Possiamo usare .property (value_change), che in questo caso è la larghezza, e non è necessario aggiungere px, ma un valore diretto.

D # 38) Dove possiamo applicare il metodo param () in jQuery?

Risposta: Possiamo visualizzare array, oggetti semplici o oggetti jquery sotto forma di un flusso di byte in modo che possano essere archiviati in memoria, file o database utilizzando il metodo param () in jQuery.

D # 39) Differenzia tra $ (this) e this in jQuery.

Risposta: $ (this) è un oggetto jQuery, mentre questo è un riferimento a un oggetto globale di JavaScript, utilizzando questo possiamo fare riferimento all'elemento DOM nel documento HTML.

$ (this) fa riferimento all'oggetto genitore, mentre questo si riferisce a un elemento DOM, che nel caso di un array, rappresenta un oggetto con il metodo .each (), che mostra l'iterazione corrente.

D # 40) Descrivi la funzionalità di lettura dei cookie, scrittura dei cookie ed eliminazione dei cookie in jQuery.

Risposta: Quando si visitano i siti Web, i cookie sono valori di dati come il nome dell'utente che vengono memorizzati in piccoli file di testo sul computer. Durante la revisione dei siti web, i cookie aiutano a ricordare il nome dell'utente. JavaScript e jQuery creano, leggono ed eliminano i cookie, con la proprietà document.cookie.

D # 41) Qual è l'uso del metodo serialize () in jQuery?

Risposta: Serializza i valori del modulo in modo che i suoi valori serializzati possano essere utilizzati nella stringa di query dell'URL durante l'esecuzione di una richiesta AJAX.

Il metodo .serialize () di jQuery restituisce i valori di input del modulo HTML sotto forma di stringa.

Q # 42) Qual è l'uso del metodo val () in jQuery?

Risposta: Il metodo .val () aiuta a trovare il valore di un attributo di un elemento HTML. Per esempio, elementi del modulo come input, select e textarea. Val () viene applicato anche per trovare il valore di tutti gli elementi corrispondenti dalle caselle di controllo e dai pulsanti di opzione, nonché da un elenco a discesa.

Esempio spiegato con la sintassi

// form elements such as dropdown with select tag and id mylst, the value of the selected option will have syntax as below $( 'select#mylst option:checked' ).val(); // form element such as a set of radio buttons with input type as radio and name rdobtn, the value can be retrieved $( 'input(type=radio)(name=rdobtn):checked' ).val();

D # 43) Che cos'è il concatenamento di metodi in jQuery? Quali vantaggi offre?

Risposta: Con il concatenamento di metodi jQuery, è possibile applicare più azioni su una singola riga di codice, poiché tutti i metodi restituiscono oggetti jQuery che possono essere utilizzati per chiamare un altro metodo.

Senza concatenamento, i metodi jQuery vengono chiamati uno dopo l'altro in una riga separata, mentre con il concatenamento, i metodi jQuery vengono scritti in una singola riga di codice separata da punti.

apri un file apk in windows

Senza concatenare più righe di codice che devono essere scritte, facendo in modo che jQuery cerchi l'intero DOM per elementi corrispondenti, vengono applicati i singoli metodi in ogni riga di codice. Considerando che il concatenamento richiede solo una selezione una tantum di un elemento corrispondente da DOM, migliorando le prestazioni.

D # 44) Qual è la differenza tra jQuery.get () e jQuery.ajax ()?

Risposta: Il metodo jQuery.ajax () viene utilizzato per inviare richieste HTTP Ajax, mentre il metodo jQuery.get () viene utilizzato per inviare richieste HTTP GET per caricare i dati dal server.

Q # 45) Cos'è QUnit?

Risposta: QUnit è un framework, che verifica il codice JavaScript scritto per jQuery, jQuery UI e jQuery Mobile, utilizza asserzioni e dispositivi di prova per verificare i risultati attesi.

D # 46) In che modo jQuery memorizza i dati relativi a un elemento?

Risposta: Il metodo jQuery.data () aiuta a collegare qualsiasi tipo di dati agli elementi DOM, senza perdite di memoria. jQuery si assicura che i dati vengano rimossi insieme agli elementi DOM rimossi tramite i metodi jQuery.

Codice per la memorizzazione e il recupero dei dati relativi a un elemento.

$('#myDiv').data('keyName', { foo : 'bar'}); $('#myDiv').data('keyName'); // { foo : 'bar'}

Q # 47) Puoi spiegare le varie procedure per estrarre una stringa di query con espressioni regolari?

Risposta: Possiamo eseguire l'estrazione di una stringa di query con un'espressione regolare nei due modi seguenti.

1. Approccio basato su stringhe: Questo metodo aiuta a derivare String confrontando espressioni regolari equivalenti, utilizzando il metodo .replace ().
2. Approccio di espressione regolare: È necessario utilizzare un metodo più potente per estrarre una stringa e un modello di query che viene confrontato con le stringhe in JavaScript. Utilizzo dei metodi .exec () e .test () per il confronto con i modelli. match (), matchAll (), replace (), search () e split () sono altri pochi metodi per String.

D # 48) Spiega il concetto del metodo finish in jQuery.

Risposta: Per fermare tutte le animazioni in coda e per aiutarle a collocarle nel loro stato finale, viene utilizzato il metodo .finish ().

D # 49) Differenzia tra la chiamata del metodo stop (true, true) e finish.

Risposta: Il metodo .finish () aiuta a cancellare la coda e aiuta le animazioni a entrare nel loro stato finale, mentre il metodo .stop () viene chiamato su un elemento, forzando l'arresto istantaneo dell'animazione attualmente in esecuzione.

Q # 50) Come puoi scrivere un codice specifico del browser usando jQuery?

Risposta: Possiamo scrivere codice specifico del browser in jQuery utilizzando navigator.userAgent per identificare il browser da Internet Explorer, Chrome, Firefox, Safari e Opera, come il codice scritto di seguito.

if (navigator.userAgent.search('MSIE') >= 0) { // JQuery Code once navigator.userAgent identifies Microsoft Internet Explorer browser. } else if (navigator.userAgent.search('Chrome') >= 0) { // JQuery Code once navigator.userAgent identifies Google Chrome browser. } else if (navigator.userAgent.search('Firefox') >= 0) { // JQuery Code once navigator.userAgent identifies Mozilla Firefox browser. } else if (navigator.userAgent.search('Safari') >= 0 && navigator.userAgent.search('Chrome') <0) { // JQuery Code once navigator.userAgent identifies either Safari or Chrome browser type. } else if (navigator.userAgent.search('Opera')>= 0) { // JQuery Code once navigator.userAgent identifies Opera browser. }

D # 51) Qual è la procedura per controllare il tipo di dati di qualsiasi variabile in jQuery?

Risposta: jQuery function type () viene utilizzata per identificare il tipo di dati di qualsiasi variabile come un array, una stringa, un numero, una funzione o un tipo di dati oggetto.

Conclusione

jQuery è una libreria JavaScript per la manipolazione di modelli di oggetti di documenti, utilizzata principalmente per l'attraversamento di documenti HTML e lo sviluppo di JavaScript cross-browser che crea animazioni DOM e Ajax per gestire gli eventi del browser.

Spero che tu abbia trovato di immenso aiuto le risposte alle domande dei colloqui più frequenti su 'jQuery'. Pratica quante più domande possibile e sii fiducioso.

Tutto il meglio per la tua intervista !!

Lettura consigliata

• Domande e risposte dell'intervista
• Domande e risposte al colloquio di prova ETL
• 50 principali domande e risposte ai colloqui di Salesforce (aggiornamento 2021)
• Alcune domande e risposte sui test manuali complicati
• Le 50 domande e risposte dell'intervista CCNA più popolari
• Le 51 principali domande e risposte dell'intervista Bootstrap
• Top 50+ domande e risposte ai colloqui di database
• 25 migliori domande e risposte per l'intervista al test agile