Visualizzazione dei risultati da 1 a 8 su 8
  1. #1
    Utente di HTML.it
    Registrato dal
    Jul 2007
    Messaggi
    82

    [JQuery] accesso diretto a un array

    Ciao a tutti,
    Ho un array che contiene 35 elementi ed è stato creato applicando un selettore. Se io ciclo questo array con un each tutto funziona correttamente. Devo però migliorare le prestazioni dell'algoritmo e necesito di accedere in modo diretto a un elemento, per esempio var x = $(array).get(2). Se uso la funzione html() su x o una qualunque altra funzione mi da errore.
    Come posso visualizzare in un alert il valore di x? (alert($(x).html()); non funziona)
    Come posso applicare a x un ulteriore selettore?

    Grazie

  2. #2
    codice:
    var x = $('.selettore').eq(2); //terzo elemento della collezione
    alert(x.html());

  3. #3
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Ciao, ti spiego il problema (anzi, i problemi).

    La funzione html() fa parte dei metodi di un oggetto jQuery.
    Il metodo get() NON restituisce un oggetto jQuery, restituisce semplicemente un elemento del DOM che di norma non possiede il metodo html() (nè alcuna altra funzione jQuery).

    In secondo luogo, non puoi passare un array per definire un selettore in quel modo

    Puoi risolvere passando al selettore una singola voce dell'array:
    codice:
    x = $(array[2]);
    alert(x.html());
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  4. #4
    Utente di HTML.it
    Registrato dal
    Dec 2013
    Messaggi
    228
    Puoi risolvere passando al selettore una singola voce dell'array:
    codice:
    x = $(array[2]);
    alert(x.html());

    Non dovrebbe essere
    x = $(array)[2];?

  5. #5
    Utente di HTML.it
    Registrato dal
    Jul 2007
    Messaggi
    82
    Mille grazie

  6. #6
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Non dovrebbe essere x = $(array)[2];?
    Si può fare in vari modi ma dipende essenzialmente dal tipo di dati dell'array e da ciò che si vuole ottenere.

    Cerco di chiarire con qualche esempio:

    Supponiamo di avere questi elementi html sulla pagina:
    codice HTML:
    <div id="c">c</div>
    <div id="b">b</div>
    <div id="a">a</div>
    L'ordine delle lettere è invertito di proposito per comprendere meglio alcune differenze.


    1. Array di elementi DOM e metodo get()
      codice:
      var selettore = [document.getElementById('a'), document.getElementById('b'), document.getElementById('c')];
      var x = $(selettore).get(2);
      x.innerHTML = 'x';
      /* --- OUTPUT ---
      x
      b
      a
      -----------------*/
      Al selettore jQuery passiamo un array di elementi, cioè una serie di elementi DOM validi.
      Il selettore, di per sè, restituisce una collezione di oggetti jQuery che rappresentano gli elementi trovati ordinandoli secondo i criteri di ricerca, cioè esaminando, di volta in volta, le singole voci dell'array secondo l'ordine in cui queste sono disposte sull'array stesso.
      Il get() filtra uno di questi oggetti e lo restituisce in forma di elemento DOM. In particolare, get(2) fa riferimento al terzo oggetto trovato che corrisponde a <div id="c"> in base all'ordine degli elementi nell'array.
      Il metodo get() restituisce un elemento DOM per cui ho dovuto utilizzare innerHTML (che è una proprietà javascript) piuttosto che html() (che è un metodo jQuery, applicabile solo ad oggetti jQuery e non ad elementi del DOM).

    2. Array di stringhe e metodo get()
      codice:
      var selettore = ['#a','#b','#c'];
      var x = $(selettore.join(',')).get(2);
      x.innerHTML = 'x';
      /* --- OUTPUT ---
      c
      b
      x
      -----------------*/
      Avendo un array di stringhe (che rappresentano dei selettori) possiamo convertirlo in un'unica stringa da passare al selettore. Nell'esempio selettore.join(',') restituisce la stringa '#a,#b,#c'.
      Il selettore restituisce sempre (e comunque) degli oggetti jQuery. In questo caso però gli oggetti sono restituiti nell'ordine in cui si presentano sul documento. Questo perché il criterio di ricerca è rappresentato da un'unica stringa che viene esaminata per intero durante la ricerca.
      Il get(2) restituisce quindi l'elemento <div id="a"> che è l'ultimo trovato durante la ricerca.
    3. Array di elementi DOM e metodo eq()
      codice:
      var selettore = [document.getElementById('a'), document.getElementById('b'), document.getElementById('c')];
      var x = $(selettore).eq(2);
      x.html('x');
      /* --- OUTPUT ---
      x
      b
      a
      -----------------*/
      Il selettore è uguale al primo esempio ma il metodo eq() restituisce un oggetto jQuery, a differenza di get() che restituisce un elemento DOM.
      Per questo motivo posso usare il metodo html().

    4. Array di stringhe e metodo eq()
      codice:
      var selettore = ['#a','#b','#c'];
      var x = $(selettore.join(',')).eq(2);
      x.html('x');
      /* --- OUTPUT ---
      c
      b
      x
      -----------------*/
      Stessa storia per il selettore di tipo stringa (esempio 2) e stessa storia per ciò che viene restituito da eq() (esempio 3).

    5. Singola voce di array come selettore
      codice:
      var selettore = [document.getElementById('a'),'<div id="#b">','#c'];
      var x = $(selettore[2]);
      x.html('x');
      /* --- OUTPUT ---
      x
      b
      a
      -----------------*/
      Qui veniamo al dunque. Rispetto ai precedenti esempi, non utilizzo ulteriori metodi (get, eq) per filtrare la collezione di oggetti trovata. In questo caso mi limito a "filtrare" preventivamente ciò che voglio cercare, semplicemente specificando una sola voce dell'array come criterio di ricerca.
      Dal momento che comunque sto passando una sola voce, l'array può avere voci in qualsiasi formato.
      Il selettore restituisce un solo oggetto (ovviamente se la voce fa riferimento ad un unico elemento).
      Non ho motivo di filtrare ulteriormente la collezione risultante ed ho, quindi, un risparmio delle risorse.
      Posso usare tranquillamente il metodo html() sull'oggetto restituito.

      A meno che non mi interessi avere una collezione di tutti gli elementi (riferiti a tutte le voci dell'array), questo mi sembra il metodo più ottimale.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  7. #7
    KillerWorm, è abbastanza evidente che quello che GK4 chiama array non è altro che una collezione jQuery ottenuta, cito, "applicando un selettore", cioè:
    codice:
    array=$('selettore');
    Cito l'intera frase:
    Ho un array che contiene 35 elementi ed è stato creato applicando un selettore. Se io ciclo questo array con un each tutto funziona correttamente.

    La sua necessità era accedere direttamente gli elementi della collezione senza usare each, ed usava erroneamente get() al posto di eq().
    Gli elementi dell' "array" erano a tutti gli effetti oggetti di jQuery.

  8. #8
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Ok, allora chiedo scusa, avevo frainteso.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.