Using contains selector in jQuery in Tamil

In jQuery, the :contains selector is used to select elements that contain a specified text string. This selector allows you to filter and target elements based on the text content they contain. Here's an explanation of how the :contains selector works:

$("element:contains('text')")

Text Matching

The :contains selector performs a case-sensitive text match. It selects elements that contain the specified text anywhere within their content.

Multiple Elements

This selector can match multiple elements. If multiple elements contain the specified text, they will all be selected.

Text as a Parameter

The text you're searching for is specified as a parameter within single or double quotes.

Common Consideration

Potential Ambiguity: Be cautious when using the :contains selector, especially with common words that might appear in various places within your document. It might select more elements than intended.

Source Code

This HTML and jQuery code demonstrates the use of the :contains selector to select and style paragraphs (<p> elements) that contain the letter 'o'. Let's break down the code

The code selects all <p> elements that contain the letter 'o' using the :contains(o) selector.
It applies a brown text color to these selected paragraphs using .css('color', 'brown').
Any paragraph (<p>) that contains the letter 'o' will have its text color changed to brown.

<html>
	<head>
		<title>Contains</title>
	</head>
	<body>
		<h1>Tutor Joes</h1>
		<p>Learn More Be Smart</p>
		<p>Let Be Simple</p>
		<p>Computer Education</p>
		<script src="js/jquery.js"></script>
		<script>
			$("document").ready(function(){
				$("p:contains(o)").css('color','brown');
			});
		</script>
	</body>
</html>

The :contains selector in jQuery is a useful tool for selecting elements based on their text content. It provides a straightforward way to filter and manipulate elements that contain a specific text string, making it a handy tool in various scenarios such as styling, hiding, or showing elements based on their textual content.

Using contains selector in jQuery in Tamil

Source Code

List of Programs

jQuery Selectors

jQuery HTML

jQuery Traversing