JQuery String methods and manipulate string

From CoderLearner
Jump to: navigation, search

A string can be make uppercase, lowercase or uppercase word

  • You can uppercase a word with $(string).toUpperCase()
  • to lowercase a word use $(string).toLowerCase()
  • Access string index use $(string).charAt(index).

How to get string index using $(string).charAt(index)

  • String index starts from 0.
</head>
<script type="text/javascript" language="javascript">
	$(document).ready(function() {
	          var string1='Hello World';
		  var char0 = string1.charAt(0); // H
		  var char1 = string1.charAt(1);// e
		  $('#content').html(char1);
	});
</script>
</head>

<body>
		<div id="content"></div>
</body>

Make string all uppercase

$(document).ready(function() {
	var string1='Hello World';
				
	var char0 = string1.toUpperCase();
	$('#content').html(char0);
});

<body>
	<div id="content"></div>
</body>

Display Result

HELLO WORLD

To make string to lowercase

$(document).ready(function() {
	var string1='Hello World';
				
	var char0 = string1.toLowerCase();
	$('#content').html(char0);
});

<body>
	<div id="content"></div>
</body>

Display Result

hello world

Capitalize a sentence

Use CSS method to set capitalizer on a set of string.

<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>All Capitalize</title>
	<script type="text/javascript" src="jquery.min.js"></script>
	<script type="text/javascript" language="javascript">
	 $(document).ready(function() {
		var string1='I go for a walk and meet some old friends';
		$('#content').css('text-transform','capitalize'); // set capitalize 
		$('#content').html(string1);
	 });
	</script>
	</head>
	<body>
		<div id="content"></div>
	</body>
</html>

Display Result

I Go For A Walk And Meet Some Old Friends

<seo metagenerator="jquery tutorial" title="Jquery/Ajax" metakeywords="jquery greater,jquery gt, jquery lt, less then, odd jquery,jquery find element, even jquery,jquery event, jquery mouse click, jquery double click, jquery hover, jquery string, jquery array, jquery button, jquery attriubtes" metadescription="jquery button, jquery attriubte, jquery example, jquery tutorial, jquery sample"/>