getting first child element using jQuery (v3)

Revision 3 of this benchmark created on


Preparation HTML

<div>
	<ul id="ul1">unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
	</ul>
	<ul>unordered list - nested children
		<li>item 1
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 2
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 3
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 4
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 5
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 6
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 7
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
	</ul>
</div>
<div>
	<ul>unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
	</ul>
	<ul>unordered list - nested children
		<li>item 1
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 2
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 3
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 4
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 5
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 6
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 7
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
	</ul>
	<ul>unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
	</ul>
	<ul>unordered list - nested children
		<li>item 1
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 2
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 3
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 4
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 5
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 6
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 7
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
	</ul>
</div>
<ul>unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
</ul>
<ul>unordered list - nested children
<ul>unordered list - nested children
	<li>item 1
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 2
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 3
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 4
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 5
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 6
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 7
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
:first pseudo-selector in children method
var x = $('#ul1').children(':first');
ready
chaining first method to children method
var x = $('#ul1').children().first();
ready
re-wrapping index 0 of children method back into jQuery
var x = $($('#ul1').children()[0]);
ready
selector with [space] and :nth-child(1) pseudo-selector
var x = $('#ul1 :nth-child(1)');
ready
eq(0) pseudo-selector in children method
var x = $('#ul1').children(':eq(0)');
ready
parent selector and :nth-child(1) pseudo-selector
var x = $('#ul1 :nth-child(1)')
ready
parent selector with > :first
var x = $('#ul1 > :first');
ready
parent selector with > :first-child
var x = $('#ul1 > :first-child');
ready
chaining filter with :first pseudo-selector to children method
var x = $('#ul1').children().filter(':first');
ready
chaining filter with :first-child pseudo-selector to children method
var x = $('#ul1').children().filter(':first-child');
ready
find method with :first pseudo-selector
var x = $('#ul1').find(':first')
ready
find method with :first-child pseudo-selector
var x = $('#ul1').find(':first-child')
ready
selector with [space] and :first pseudo-selector
var x = $('#ul1 :first');
ready
selector with [space] and :first-child pseudo-selector
var x = $('#ul1 :first-child');
ready
chaining eq(0) to children
var x = $('#ul1').children().eq(0);
ready

Revisions

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