Some Useful JavaScript & jQuery Snippets – Part 3

How to hide all children div except a specific one with jQuery? $(‘#target div:not(#exclude)’).hide(); //or $(‘#target’).children().filter(‘:not(#exclude)’).hide(); Detecting when a div’s height changes using jQuery $(‘element’).bind(‘resize’, function(){ alert( ‘Height changed to’ […]

By cody in Playground on January 8, 2010

From our sponsor: Meco is a distraction-free space for reading and discovering newsletters, separate from the inbox.

How to hide all children div except a specific one with jQuery?

$('#target div:not(#exclude)').hide();
//or
$('#target').children().filter(':not(#exclude)').hide();

Detecting when a div’s height changes using jQuery

$('element').bind('resize', function(){
alert( 'Height changed to' + $(this).height() );
}

Delete all table rows except first

$('someTableSelector').find('tr:gt(0)').remove();

Selecting root element of a certain level in the document

1 level:
$('*:not(* *)');
2 level:
$('*:not(* *)').find('> *');
3 level:
$('*:not(* *)').find('> * > *');

Tiny break: 📬 Want to stay up to date with frontend and trends in web design? Subscribe and get our Collective newsletter twice a tweek.

Searching a string in jQuery

var foundin = $('*:contains("some string bla bla")');

Get the distance scrolled from top

alert($(document).scrollTop());

Select all elements except the ones with a given class

$('* :not(.someclass)')

Add a row to a table

$('#myTable tr:last').after('<tr>...</tr>');

How to convert decimal to hexadecimal?

num = num.toString(16);
reverse process:
num = parseInt(num, 16);

Filtering By More Than One Attribute in JQuery

var elements = $('#someid input[type=sometype][value=somevalue]').get();

How to expire a cookie in x minutes

var date = new Date();
date.setTime(date.getTime() + (x * 60 * 1000));
$.cookie('example', 'foo', { expires: date });

Selecting the first x items with jQuery

example: first 10 anchors
$('a').slice(0,10);
//or
$('a:lt(10)');

Working with a select element

//Get the value of a selected option
$('selectElement').val();

//Get the text of a selected option
$('#selectElementId :selected').text();

//Remove an option (e.g. id=1)
$("#selectElementId option[value='1']").remove();