<%--
Document : string_methods
Created on : 19 Jun, 2025, 12:48:02 PM
Author : Mrunali
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>String methods</title>
<script type="text/javascript">
function trim_str(){
const a = document.getElementById("name").value;
const b = a.trim();
document.getElementById("msg").value = b;
console.log(b);
}
function touppercase(){
const a = document.getElementById("name").value;
const b = a.toUpperCase();
document.getElementById("msg").innerHTML= b;
document.getElementById("msg").value = b;
console.log(b);
}
function tolowercase(){
const a = document.getElementById("name").value;
const b = a.toLowerCase();
document.getElementById("msg").innerHTML= b;
document.getElementById("msg").value = b;
console.log(b);
}
function charat(){
const a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const c = a.charAt(parseInt(b));
document.getElementById("msg").innerHTML= c;
document.getElementById("msg").value = c;
console.log(b);
}
function concate(){
const a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const c = a.concat(" ",b);
document.getElementById("msg").innerHTML= c;
document.getElementById("msg").value = c;
}
function indexof(){
const a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const c = a.indexOf(b);
document.getElementById("msg").innerHTML= c;
document.getElementById("msg").value = c;
}
function lastindexof(){
const a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const c = a.lastIndexof(" ",b);
document.getElementById("msg").innerHTML= c;
document.getElementById("msg").value = c;
}
function slice_str(){
const a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const c = document.getElementById("str").value;
const d = a.slice(parseInt(b),parseInt(c));
document.getElementById("msg").innerHTML= d;
document.getElementById("msg").value = d;
}
function replacement(){
const a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const c = document.getElementById("str").value;
const d = a.replace(b,c);
document.getElementById("msg").innerHTML= d;
document.getElementById("msg").value = d;
}
function split_str(){
cconst a = document.getElementById("name").value;
const b = document.getElementById("str").value;
const d = a.split(""+b+"");
document.getElementById("msg").innerHTML= d;
document.getElementById("msg").value = d;
}
</script>
<style>
.left{
width: 50%;
float: left;
background-color: lightgrey;
text-align:center;
padding : 30px;
}
.right{
width: 50%;
float: right;
background-color: lightblue;
text-align:center;
padding: 30px;
}
</style>
</head>
<body>
<div width="100%">
<div class="left">
<input type="text" size="20px" placeholder="input" id="name">
<hr>
<input type="text" size="20px" placeholder="input" id="str">
<hr>
<input type="text" size="20px" placeholder="Output" id="msg">
<hr>
<button onClick="trim_str()" style="background-color:
yellow">Trim</button>
<hr>
<button onClick="touppercase()" style="background-color:
red">touppercase</button>
<hr>
<button onClick="tolowercase()" style="background-color:
green">tolowercase</button>
<hr>
<button onClick="charat()" style="background-color:
gray">charat</button>
<hr>
<button onClick="concate()" style="background-color:
gold">concate</button>
<hr>
<button onClick="indexof()" style="background-color:
wheat">indexof</button>
<hr>
<button onClick="lastindexof()" style="background-color:
burlywood">lastindexof</button>
</div>
<div class="right">
<input type="text" size="20px" placeholder="input string"
id="name">
<hr>
<input type="text" size="20px" placeholder="input" id="str">
<hr>
<input type="text" size="20px" placeholder="input" id="str1">
<hr>
<input type="text" size="20px" placeholder="Output" id="msg">
<hr>
<button onClick="slice_str()" style="background-color:
blue">slice</button>
<hr>
<button onClick="replacement()" style="background-color:
silver">replace</button>
<hr>
<button onClick="split_str()" style="background-color:
pink">split</button>
</div>
</div>
<div id="msg"></div>
</body>
</html>
