javascript string method1
HTML
<form>
<fieldset>
<legend align="center">javascript string methods</legend>
<label>eneter 1st string:</label> <input type="text" id="txt" name="txt"><br><br>
<label>here is the result:</label> <input type="text" id="res" name="res"><br><br>
<button type="button" onclick="len()" >length</button>
<button type="button" onclick="upper()" >upper case</button>
<button type="button" onclick="lower()" >lower case</button>
</fieldset>
</form>
CSS
form{
width: 600px;
height: auto;
margin: 5px auto;
padding: 25px;
}
fieldset{
color:blueviolet;
border-radius: 10% 10% 0% 0%;
border:5px solid rebeccapurple;
}
legend{
color:rebeccapurple;
font-size: 25px;
font-family: cursive;
}
label{
font-family: cursive;
color: crimson;
font-size: 15px;
font-weight: bold;
}
button{
width: auto;
background-color: rebeccapurple;
height: 35px;
color: white;
font-family: cursive;
font-weight: bold;
width: 150px;
float: left;
margin: 2px 15px;
}
input[type=text]
{
width: 180px;
height: 25px;
font-size: 18px;
font-family: cursive;
}
JAVASCRIPT
function len()
{
var x=document.getElementById('txt').value;
document.getElementById('res').value=x.length;
}
function upper()
{
var x=document.getElementById('txt').value;
document.getElementById('res').value=x.toUpperCase();
}
function lower()
{
var x=document.getElementById('txt').value;
document.getElementById('res').value=x.toLowerCase();
}
