I selettori in jQuery

I selettori in jQuery

I selettori sono una delle funzionalità più importanti della libreria jQuery, esattamente come in Javascript, essi permettono di individuare gli elementi DOM della pagina HTML, soltanto che la sintassi è molto più breve rispetto a JS.

indice

Sintassi dei selettori in jQuery

//	Esempio di seleziona tutto: 
$('*')
// Esempio di seleziona liste 
$('li')
// Esempio di selezioni multiple 
$('#primoPar, #secondoPar')
// Esempio di selezione corrente
$(this)

// Esempio di altro metodo selettivo per id: 
$('[id=arg1]')
// Esempio di altro metodo selettivo per classi 
$('[class=example]')

// Esempio di selezione ad esclusione: 
$('p[class!=speciale]')
// Esempio di selezione per quelli che iniziano con 
$('[id^=arg]')
// Esempio di selezione per quelli che finiscono con 
$('[id$=Par]')
// Esempio di selezione per quelli  che contengono 
$('[class *= muck]')
// Esempio di selezione per quelli che contengono la parola ma NON SONO separati
$('[id |= arg]')
// Esempio di selezione per quelli che contengono la parola ma SONO separati 
$('[id ~= arg]')

Esempio sui Selettori in jQuery

You say potatoe, I say starchy carbs. Logan Broger is "amazing" and a "wonderful boy" according to Logan's mom.

testo di esempio .testo di esempio .testo di esempio .testo di esempio .testo di esempio .

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Felinamiss. I don't need a big house, just a two-floor condo - you could say I have lofty expectations.

Smiling could easily be misinterpreted for showing your teeth to someone because they said something that made you happy.

I bet most serial killers play the drums. I'm in a band that does Metallica covers with our private parts

Lui cammino ritorni giu strazii. Me vorrei vi ch fresco andate ve. Puo impedisce esistenza tue inebriato sua che solitario.

Emergevano ingannaste tal ingranditi sfaldavano animazione ora impaziente tre. Ci me attesa lo fianco saluta mentre.

Emergevano ingannaste tal ingranditi sfaldavano animazione ora impaziente tre. Ci me attesa lo fianco saluta mentre.

Emergevano ingannaste tal ingranditi sfaldavano animazione ora impaziente tre. Ci me attesa lo fianco saluta mentre.

Emergevano ingannaste tal ingranditi sfaldavano animazione ora impaziente tre. Ci me attesa lo fianco saluta mentre.

Codice della Lezione : Le variabili in jQuery

// Inizializzazione
$(document).ready(function(){
// Esempio : al click del bottone con id primoBtn seleziona tutto (*) e modifica la grandezza del font su tutto.

    $('#button1').click(function(){
       $('*').css('font-family','Arial, Helvetica, sans-serif'); 
       $('ol').css('background-color','#fcfcfc')
    });

// Esempio di selezione multipla
    $('#button2').click(function(){
        $('#txtID1, #txtID9').css('color','#fcfcfc');
    });

// Esempio di selezione ELEMENTO CORRENTE (this)
    $('.txtClass').hover(function(){
        $(this).css('border','2px dotted #333333');
        $(this).css('background-color','#337D54')
        $(this).css('color','#fafafa');
        $(this).css('padding','10px');
    });    

// Esempio di selezione degli attributi
    $('#button3').click(function(){
        // altro metodo per selezionare con ID
        $('[id=arg-1]').css('color','red');
        // altro metodo per selezionare con le classi
        $('[class=example]').css('border','1px dashed #333');
        $('[class=example]').css('padding','10px');
    });   

// Esempio di selezione degli attributi
$('#button4').click(function(){
    // altro metodo per selezionare con ID
    $('p[class!=speciale]').css('color','green');
});   

// Esempio di selezione 
$('#button5').click(function(){
    // Seleziona solo quelli che iniziano con
    $('[id^=arg]').css('display','none');
});  

// Esempio di selezione 
$('#button6').click(function(){
    // Seleziona solo quelli che finiscono con
    $('[id$=ID8]').css('display','none');
});   

// Esempio di selezione 
$('#button7').click(function(){
    // Seleziona solo quelli che contengono con *=
    $('[class *= muck]').css('display','none');
});   

// Esempio di selezione 
$('#button8').click(function(){
    // Seleziona solo quelli che contengono la parola "txtClass" ma che non hanno spazio tra loro
    $('[class |= "txtClass"]').css('display','none');
});   

// Esempio di selezione 
$('#button9').click(function(){
    // Seleziona tutti i caratteri che contengono la parola "txt" ma che hanno uno spazio
    $("[class~='example']").css('display','none');
});   

});


Scritto da Donato Pirolo

Ciao, sono Donato, frontend developer con una smisurata passione per la SEO. Creo strumenti ad hoc per aiutare aziende e professionisti ad essere cercati sul web e trovare clienti.

Potrebbero interessarti

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Copyright © 2022
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram