Come posso ottenere StackOutflow/StackExchange - come tooltips di tag-hover?

Question

Quando si passa con il mouse su un tag su Stackoverflow, viene visualizzata una descrizione comando come mostrato di seguito. Questo è probabilmente realizzato tramite jquery.append, poiché inserisce codice HTML alla fine del documento HTML. Su ogni evento hover, dopo un certo ritardo, viene fatta una richiesta AJAX, - probabilmente tramite jquery.load (...)

La query url inviata a webapps.stackexchange.com è ad esempio _ = 1318962590136, che è un ID dinamico.

• 1) Come funziona questo sul client e sul server e quali sono i vantaggi?

Il carico utile per la toolip è HTML e si presenta così:

<div><div class="tm-heading">...</div></div><span>.......</span> 

Al momento di lasciare il tag, il codice HTML caricato dinamicamente viene rimosso. Gli stili css sono già presenti nel css-sheet caricato del sito stackoverflow.

• 2) Nessun evento inizialmente dichiarato sembra essere collegato all'elemento di collegamento <a> stilizzato, che costituisce il tag. Solo gli eventi di mousedown sembrano essere dichiarati (controllati tramite Chrome).

JavaScript-Deobfuscator sta dando qualche indizio: I listener di eventi sono aggiunti in modo dinamico e rimossi così ...

function (a, b, c) { 
    a.removeEventListener && a.removeEventListener(b, c, !1); 
} 

Answer 1

Con l'aggiornamento dei dati solo quando l'utente attiva l'hover evento, significa che non devi costantemente interrogare il database ogni x quantità di secondi. Questo metodo è uno spreco totale di risorse, soprattutto quando si desiderano informazioni estremamente aggiornate, in cui potrebbe essere tentato di chiamare il server ogni secondo.

Ma un modo migliore di farlo (anche meglio del metodo di cui si parla nella tua domanda) è un metodo chiamato Cometa. Cometa in termini semplici significa che il client effettua una richiesta al server, quindi attende che il server risponda (ad esempio quando i dati sul server vengono aggiornati). Ciò significa che il server viene chiamato solo quando vi sono dati aggiornati da inviare al client. Questo è il modo (credo) che Facebook funzioni per esempio.