Info

Compares different techniques to match first matching element.

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div id="first"><span class="test"></span></div>
<div id="second"><span class="test"></span><div>
<div id="e3"><span class="test"></span><div>
<div id="e4"><span class="test"></span><div>
<div id="e5"><span class="test"></span><div>
<div id="e6"><span class="test"></span><div>
<div id="e7"><span class="test"></span><div>
<div id="e8"><span class="test"></span><div>
<div id="e9"><span class="test"></span><div>
<div id="e10"><span class="test"></span><div>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

$("span.test:first").text("Welcome");

$("#first span.test").text("Welcome");

$("span.test").first().text("Welcome");

$("span.test").eq(0).text("Welcome");

$("span.test", "#first").text("Welcome");

You can edit these tests or add even more tests to this page by appending /edit to the URL.

Compare results of other browsers

0 comments