How to query the number of child elements in jquery

青灯夜游
Release: 2022-03-16 16:05:58
Original
4633 people have browsed it

How to query the number of child elements in jquery: 1. Use the children() function to obtain and return a collection containing all child elements; 2. Use the length attribute to obtain the number of all child elements in the element collection. , the syntax is "parent element object.children().length".

How to query the number of child elements in jquery

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

How to query the number of child elements in jquery

In jquery, you can use the children() method and the length attribute to query the number of child elements number.

  • The children() function obtains and returns a set containing all child elements

  • The length attribute obtains the number of all child elements in the element set

Implementation code:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					var res = $("div").children().length;
					alert("子元素个数为:"+res);
				});
			});
		</script>
	</head>
	<body>

		<div>
			<p>子元素1</p>
			<p>子元素2</p>
			<p>子元素3</p>
		</div><br>
		<button>div元素中有几个子元素</button>

	</body>
</html>
Copy after login

How to query the number of child elements in jquery

[Recommended learning: jQuery video tutorial, web front-end

The above is the detailed content of How to query the number of child elements in jquery. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template