OpenJS Foundation - openjsf.org · api.jquery.com

all selector

Description: Selects all elements.

  • version added: 1.0jQuery( "*" )

Caution: The all, or universal, selector is extremely slow, except when used by itself.

Examples:

Example 1

Find every element (including head, body, etc) in the document. Note that if your browser has an extension/add-on enabled that inserts a <script> or <link> element into the DOM, that element will be counted as well.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

<!doctype html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>all demo</title>

<style>

h3 {

margin: 0;

}

div, span, p {

width: 80px;

height: 40px;

float: left;

padding: 10px;

margin: 10px;

background-color: #EEEEEE;

}

</style>

<script src="https://code.jquery.com/jquery-4.0.0.js"></script>

</head>

<body>

<div>DIV</div>

<span>SPAN</span>

<p>P <button>Button</button></p>

<script>

var elementCount = $( "*" ).css( "border", "3px solid red" ).length;

$( "body" ).prepend( "<h3>" + elementCount + " elements found</h3>" );

</script>

</body>

</html>

Demo:

Example 2

Find all elements within document.body so elements like head, script, etc. are excluded.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

<!doctype html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>all demo</title>

<style>

h3 {

margin: 0;

}

div, span, p {

width: 80px;

height: 40px;

float: left;

padding: 10px;

margin: 10px;

background-color: #EEEEEE;

}

#test {

width: auto;

height: auto;

background-color: transparent;

}

</style>

<script src="https://code.jquery.com/jquery-4.0.0.js"></script>

</head>

<body>

<div id="test">

<div>DIV</div>

<span>SPAN</span>

<p>P <button>Button</button></p>

</div>

<script>

var elementCount = $( "#test" ).find( "*" ).css( "border", "3px solid red" ).length;

$( "body" ).prepend( "<h3>" + elementCount + " elements found</h3>" );

</script>

</body>

</html>

Demo:

Read the original on api.jquery.com ↗