html Archives - Ebhor.com

Java String Method charAt()

This method takes one integer argument and return a character specified at index position. For any string the index value starts from 0 to string length -1 position. If passed index value not in valid range then it throws IndexOutOfBoundsException.

For example string Hello Friends contains 13 characters starting from 0 to 12 H is first position with index value 0, F is in seventh position with index value 6 and s is in 13 position with index value 12.
Using numbre other then 0 to 12( 0 to length()-1) will result in IndexOutOfBountException

Signature:

public char charAt(int index)

Parameters:

index -Integer index value to get character at specified index position.

Return:

Character at passed index value.

Exception Throws:

IndexOutOfBoundsException If index value in not between 0 to String length()-1

Example

public class StringChatAtExample {

    public static void main(String args[]) {
        String test = "Java String charAt() example";
        char firstCharacter = test.charAt(0);
        char sixthCharacter = test.charAt(5);
        char lastCharacter = test.charAt(test.length() - 1);
        System.out.println("String:" + test);
        System.out.println("Character at first position: " + firstCharacter);
        System.out.println("Character at sixth position: " + sixthCharacter);
        System.out.println("Character at last position: " + lastCharacter);
    }

}

public class StringChatAtExample {

public static void main(String args[]) {

String test = "Java String charAt() example";

char firstCharacter = test.charAt(0);

char sixthCharacter = test.charAt(5);

char lastCharacter = test.charAt(test.length() - 1);

System.out.println("String:" + test);

System.out.println("Character at first position: " + firstCharacter);

System.out.println("Character at sixth position: " + sixthCharacter);

System.out.println("Character at last position: " + lastCharacter);

}

Result

String:Java String charAt() example
Character at first position: J
Character at sixth position: S
Character at last position: e

String:Java String charAt() example

Character at first position: J

Character at sixth position: S

Character at last position: e

Now Print all characters with its index value

Example

public class StringChatAtExample1 {
    public static void main(String args[]) {
        String test = "Java String charAt() example";
       for(int i=0;i&lt;=test.length()-1;i++){
           System.out.println("Character at  index value "+i+" = "+test.charAt(i));
       }
    }

}

public class StringChatAtExample1 {

public static void main(String args[]) {

String test = "Java String charAt() example";

for(int i=0;i<=test.length()-1;i++){

System.out.println("Character at index value "+i+" = "+test.charAt(i));

}

Result

Character at  index value 0 = J
Character at  index value 1 = a
Character at  index value 2 = v
Character at  index value 3 = a
Character at  index value 4 =  
Character at  index value 5 = S
Character at  index value 6 = t
Character at  index value 7 = r
Character at  index value 8 = i
Character at  index value 9 = n
Character at  index value 10 = g
Character at  index value 11 =  
Character at  index value 12 = c
Character at  index value 13 = h
Character at  index value 14 = a
Character at  index value 15 = r
Character at  index value 16 = A
Character at  index value 17 = t
Character at  index value 18 = (
Character at  index value 19 = )
Character at  index value 20 =  
Character at  index value 21 = e
Character at  index value 22 = x
Character at  index value 23 = a
Character at  index value 24 = m
Character at  index value 25 = p
Character at  index value 26 = l
Character at  index value 27 = e

Character at index value 0 = J

Character at index value 1 = a

Character at index value 2 = v

Character at index value 3 = a

Character at index value 4 =

Character at index value 5 = S

Character at index value 6 = t

Character at index value 7 = r

Character at index value 8 = i

Character at index value 9 = n

Character at index value 10 = g

Character at index value 11 =

Character at index value 12 = c

Character at index value 13 = h

Character at index value 14 = a

Character at index value 15 = r

Character at index value 16 = A

Character at index value 17 = t

Character at index value 18 = (

Character at index value 19 = )

Character at index value 20 =

Character at index value 21 = e

Character at index value 22 = x

Character at index value 23 = a

Character at index value 24 = m

Character at index value 25 = p

Character at index value 26 = l

Character at index value 27 = e

HTML head tag

As we have already seen the structure of html document. The root of the document is html tag then there are two child tags head and body.
Head tag contains meta data of a web page like title, meta,link,base.

Syntax

<html>
   <head>
      .
      .
   </head>
  <body>

  </body>
</html>

<html>

<head>

</head>

<body>

</body>

</html>

Example

<html>
   <head>
     <title>My First Page</title>
   </head>
  <body>
           Hello How are you.
  </body>
</html>

<html>

<head>

<title>My First Page</title>

</head>

<body>

Hello How are you.

</body>

</html>

HTML Subscript and Superscript tags

To show data in subscript and in superscript format we use <sub>..</sub> and <sup>..</sup> tags.

X<sup>2</sup>+Y<sup>2</sup>
H<sub>2</sub>O

1 2	X<sup>2</sup>+Y<sup>2</sup> H<sub>2</sub>O

Example:

Output:

X²+Y²
H₂O

HTML Bold Italic & Underline Tags

For creating bold Itelic and Underline text we use following syntax.
We can also use nesting of tags

Example:

<b>This is a bold text</b>
<i>This is a italic text</i>
<u>This text is a underline</u>
<b><i>This is a bold and italic text</i></b>

<i>This is a italic text</i>

<u>This text is a underline</u>

<b><i>This is a bold and italic text</i></b>

Output:

This is bold text
This is italic text
This text is underline
This is bold and italic text

HTML 5 Document Structure

General Synax of html5 is

<!DOCTYPE html>
<html lang="en">
   <head>
         ...
   </head>
   <body>
      .......
   </body>
 </html>

<!DOCTYPE html>

<head>

...

</head>

<body>

.......

</body>

</html>

<!DOCTYPE html> specifies that this document is html 5 document and you can use all html5 tags here.

<html> is root tag of html document it contains two child tags <head> and <body>

<head> specifies that this portion contains heading information of page we can use many other tags here like <title> which is used to specify the title of page and may other.

<body> we put the contents which you would like to display on browser.
Inside body tag we use many different html tags to proper formatting the data.

Example

<!DOCTYPE html>
<html lang="en">
   <head>
      <title>My First Html Page</title>
   </head>
   <body>
      <h1>Welcome to my first html page</h1>
   </body>
 </html>

<!DOCTYPE html>

<head>

<title>My First Html Page</title>

</head>

<body>

<h1>Welcome to my first html page</h1>

</body>

</html>

In above syntax start and end tags are optional.

if you dont want to use any attribute with root tab ie <html lang=”en”> then you can omit this

So syntax with out root tag

<!DOCTYPE html>
   <head>
         ...
   </head>
   <body>
      .......
   </body>

<!DOCTYPE html>

<head>

...

</head>

<body>

.......

</body>

Exampe of html document

Example

<!DOCTYPE html>
   <head>
      <title>My First Html Page</title>
   </head>
   <body>
      <h1>Welcome to my first html page. Removed root tag</h1>
   </body>

<!DOCTYPE html>

<head>

<title>My First Html Page</title>

</head>

<body>

<h1>Welcome to my first html page. Removed root tag</h1>

</body>

In the XHTML syntax we have to specify the xmlns to declare that it is a HTML namespace.

We can use lang or xml:lang attribute to specify the language

Syntax with xmlns

<html xmlns="http://www.w3.org/1999/xmlns" xml:lang="en">
   <head>
         ...
   </head>
   <body>
      .......
   </body>

<head>

...

</head>

<body>

.......

</body>

Example

<html xmlns="http://www.w3.org/1999/xmlns" xml:lang="en">
   <head>
      <title>My First Html Page</title>
   </head>
   <body>
      <h1>Welcome to my first html page. Removed root tag</h1>
   </body>
</html>

<head>

<title>My First Html Page</title>

</head>

<body>

<h1>Welcome to my first html page. Removed root tag</h1>

</body>

</html>

Example

<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
   <head>
      <title>My First Html Page</title>
   </head>
   <body>
      <h1 style="background-color:cyan;font-size:20px">Welcome to my first html page</h1>
      <p>Keep learnig html5 its simple and easy </p>
   </body>
 </html>

<!DOCTYPE html>

<head>

<title>My First Html Page</title>

</head>

<body>

<h1 style="background-color:cyan;font-size:20px">Welcome to my first html page</h1>

<p>Keep learnig html5 its simple and easy </p>

</body>

</html>

HTML pre tag

The pre tag is used to display preformatted text in HTML document. pre tag preserves the content structure it can be used to show pre-formated data stored in the database and in another documents and to show computer codes programs to HTML document.

Syntax:

<pre>...

<pre>...

Example:

<!DOCTYPE html>
<html>

  <head>
    <title>
      Example of HTML pre tag
    </title>
  </head>

  <body>
    <pre>
    This is a pre tag example.
    This preserves      the 
    
        text
        
        
        
        strutcture
    
    
    
       Done!!

<!DOCTYPE html>

<html>

<head>

<title>

Example of HTML pre tag

</title>

</head>

<body>

<pre>

This is a pre tag example.

This preserves the

text

strutcture

Done!!

Result:

Pre tag can also be used to represent formatted computer codes like programing language code to show in HTML document like below

Example:

<!DOCTYPE html>
<html>

  <head>
    <title>
      Example of HTML pre tag
    </title>
  </head>

  <body>
    <pre>
     function sum(){
            var a=5;
            var b=9;
            var c=a+b;
            document.write("Sum is "+c); 
      }

<!DOCTYPE html>

<html>

<head>

<title>

Example of HTML pre tag

</title>

</head>

<body>

<pre>

function sum(){

var a=5;

var b=9;

var c=a+b;

document.write("Sum is "+c);

}

Result:

HTML br tag

The br tag is used to break the line.
It does not have closing tag.

<br/>

<br/>

Example:

Hello How are you.
<br/>
Feeling well.

Hello How are you.

<br/>

Feeling well.

Result:
Hello How are you.

Feeling well.

HTML hr tag

Hr is used to show horizontal line in html document.
When ever we have to give any horizontal row between two element we use this tag
Hr does not have any closing tag.

Syntax

<hr>

<hr>

Example:

<p>Hello How are you</p>
<hr>
<p>Whats going on</p>

<p>Hello How are you</p>

<hr>

<p>Whats going on</p>

Output:

Hello How are you

Whats going on

HTML List

HTML provides three types of lists

Ordered List
Unordered List
Definition List

Lets see each list one by one with suitable example.

Ordered List

This list are used to show information where order is important. for this we use ol tag.
inside <ol>..</ol> we use <li> tag.

Syntax

<ul>
    <li>Element1</li>
    <li>Element2</li>




    <li>Element n</li>
</ul>

<ul>

<li>Element1</li>

<li>Element2</li>

<li>Element n</li>

</ul>

We can use type attribute to show list number type.

<ol type=”1″ value=”1″> list start with number 1 and its type is numberic
<ol type=”1″ value=”5″> list start with number 5 and its type is numberic
<ol type=”A”> list start with capital letter A
<ol type=”A” value=”3″> list start with capital letter C
<ol type=”a”> list will start with small letter a
<ol type=”I”> list will start with capital roman letter
<ol type=”i”> list will start with small roman letter

Example:

<h1>Top 5 Topper of the class</h1>
<ol>
   <li>Ram</li>
   <li>Mohan</li>
   <li>Ramesh</li>
   <li>Nitesh</li>
   <li>Nita</li>
   <li>Manish</li>
</ol>

<h1>Top 5 Topper of the class</h1>

<ol>

<li>Mohan</li>

<li>Ramesh</li>

<li>Nitesh</li>

<li>Manish</li>

</ol>

Unordered List

This list are used to show information where order is not important. for this we use ul tag.
inside <ul>..</ul> we use <li> tag.

<ol>
    <li>Element1</li>
    <li>Element2</li>




    <li>Element n</li>
</ol>

<ol>

<li>Element1</li>

<li>Element2</li>

<li>Element n</li>

</ol>

You can use type attribute for showing different list market type.
like <li type=”disc”>, <li type=”circle”> or <li type=”square”>

Example:

<h1>List of Computer Items</h1>
<ul>
<li>Monitor</li>
<li>CPU</li>
<li>Keyboard</li>
<li>Mouse</li>
<li>Printer</li>
<li>Projector</li>
</ul>

<h1>List of Computer Items</h1>

<ul>

<li>Monitor</li>

<li>Keyboard</li>

<li>Mouse</li>

<li>Printer</li>

<li>Projector</li>

</ul>

Definition List

To provide terms with definition we use definition list
for using definition list we use <dl>..</dl> tag.
Inside dt tag we use <dt>..</dt> for term to define
For definition(description) of term we use <dd>..</dd>

<h1>Definition List</h1>
<dl>
   <dt>Keyboard</dt>
   <dd>An input device</dd>
   <dt>Monitor</dt>
   <dd>An output device</dd>
</dl>

<h1>Definition List</h1>

<dl>

<dt>Keyboard</dt>

<dd>An input device</dd>

<dt>Monitor</dt>

<dd>An output device</dd>

</dl>

We can also use nested list means list inside another list of any kind.

HTML Table rowspan and colspan

To span a row more than a single row we can use rowspan attribute.

Example:

Group 1 Manish Durg India
Manoj Bhopal India

Group 2 Rohit Banglore India
Nitesh Bhopal India

<table style="border:1px solid black">
<tbody>
<tr>
<td>1</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</tbody>
</table>

<tbody>

<tr>

</tr>

<tr>

</tr>

</tbody>

</table>

Output:

Group 1	Manish	Durg India
Group 1	Manoj	Bhopal India
Group 2	Rohit	Banglore India
Group 2	Nitesh	Bhopal India

To span a column more than a single column we can use colspan attribute.
Example:

     Durg    India
     Bhopal  India

     Banglore    India
     Bhopal      India

Durg India

Bhopal India

Banglore India

Bhopal India

<table style="border:1px solid black">
<tbody>
<tr>
<td colspan="2">Group 1</td>
</tr>
<tr>
<td>Manish</td>
<td>Manoj</td>
<td colspan="2">Group 2</td>
<td>Rohit</td>
<td>Nitesh</td>
</tr>
</tbody>
</table>

<tbody>

<tr>

<td colspan="2">Group 1</td>

</tr>

<tr>

<td>Manish</td>

<td>Manoj</td>

<td colspan="2">Group 2</td>

<td>Rohit</td>

<td>Nitesh</td>

</tr>

</tbody>

</table>

Output:

Group 1
Manish	Durg India
Manoj	Bhopal India
Group 2
Rohit	Banglore India
Nitesh	Bhopal India