15 Feb 2014
“this” Keyword
“this” refer to the object on which a method is being invoke. We can pass “this” as an argument in function, as in given examples:
example 1
<html>
<head>
<script type=”text/javascript”>
function focusTr(objTr){
objTr.style.background =”yellow”;
objTr.style.color =”red”;
}
function unFocusTr(objTr){
objTr.style.background =”white”;
objTr.style.color =”black”;
}
</script>
</head>
<body>
<table border=”1″ width=”480px”>
<tr>
<th>Name</th> <th>Sallary</th> <th>Phone</th>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Albert</td> <td>9000</td> <td>987457687</td>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Sunny</td> <td>15000</td> <td>987457887</td>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Mark</td> <td>63000</td> <td>987457767</td>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Peeter</td> <td>23000</td> <td>7987554447</td>
</tr>
</table>
</body>
</html>
<head>
<script type=”text/javascript”>
function focusTr(objTr){
objTr.style.background =”yellow”;
objTr.style.color =”red”;
}
function unFocusTr(objTr){
objTr.style.background =”white”;
objTr.style.color =”black”;
}
</script>
</head>
<body>
<table border=”1″ width=”480px”>
<tr>
<th>Name</th> <th>Sallary</th> <th>Phone</th>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Albert</td> <td>9000</td> <td>987457687</td>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Sunny</td> <td>15000</td> <td>987457887</td>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Mark</td> <td>63000</td> <td>987457767</td>
</tr>
<tr onmouseover=”focusTr(this)” onmouseout=”unFocusTr(this)”>
<td>Peeter</td> <td>23000</td> <td>7987554447</td>
</tr>
</table>
</body>
</html>
example 2
<html>
<head>
<script type=”text/javascript”>
function clr(objTxt){
objTxt.value = “”;
}
function fill(objTxt){
if(objTxt.value==””) {
objTxt.value = “enter name”;
}
}
</script>
</head>
<body>
Ener Name <br/>
<input type=”text” id=”txtName” value=”enter name” onClick=”clr(this)” onblur=”fill(this)”/>
</body>
</html>
<head>
<script type=”text/javascript”>
function clr(objTxt){
objTxt.value = “”;
}
function fill(objTxt){
if(objTxt.value==””) {
objTxt.value = “enter name”;
}
}
</script>
</head>
<body>
Ener Name <br/>
<input type=”text” id=”txtName” value=”enter name” onClick=”clr(this)” onblur=”fill(this)”/>
</body>
</html>