WH

jQuery Performance Tips #1

Checking Visibility

// Visibility Test Cases

$("#word").is(":visible");
$("#word:visible").length == 1;
$("#word:visible").length > 0;
$("#word").css("display") == "block";
$("#word").is(":not(:hidden)");
!$("#word").is(":hidden");

Results

All major browsers perform really well using 4) the css display block, except for Chrome based browsers. The chrome based browsers, Chrome and new Opera, perform the best with 6) ! is :hidden. The comparison, 6) ! is :hidden, looks like the one to use over the 1) .is(':visible').

Finding Option Selected in Select List

// Find Selected Cases

$("select").find(":selected");
$("select option:selected");
$("select > option").filter(":selected");
$("select > option:selected");
$("select").children("option:selected");
$("select > option").find(":selected");
$("select").children("option").filter(":selected");
$("select").children().filter(":selected");

Summary

All major browsers perform well using the children selectors (5, 7, 8). The best of children filters tend to be 5) .children('option:selected').