SQL PHP HTML ASP JavaScript articles and free scripts to download If you are facing any problem in viewing this page, please tell us
 

document title of a page by JavaScript


Title tag of the web page is one of the important tag of a html page. The keywords used inside this title tag has high relevant for search engine ranking of a site. You can read on title tag keywords at search engine friendly page here.

You can read html title tag here.

We will discuss here how to manage the title tag by using the document property in JavaScript.

The basic syntax to manage content of the title tag is here.

document.title=" this is my new title ";


You can see how the tag is changed. Now let us try one demo. Type some text here and click the button.



Now watch the title at the top left corner of this page.

You may be thinking why I should press the button? We can keep on changing the title as we type the keys. Here we will use onkeyup event handler to read the key data. Here is the demo.

Ok now the source code for the above demos , first the top one ( by pressing the button )
<html>
<head>
<title></title>
<script type="text/javascript">
function change_title(){
document.title=document.getElementById("t1").value;
}

</script>
</head>
<body>

<form name=f1 method=post>
<input type=text name=t1 id="t1">
<input type=button onClick='change_title()'; value='Change Title'>
</form>

</body>
</html>


Now the code for second example ( without the submit button by using onkeyup event handler)

<html>
<head>
<title>Original title ends</title>
<script type="text/javascript">
function change_title(keyEvent){
//alert(keyEvent);
keyEvent = (keyEvent) ? keyEvent: window.event;
input = (keyEvent.target) ? keyEvent.target :
keyEvent.srcElement;

if(keyEvent.type=="keyup"){

if(input.value){
document.title=document.getElementById("t1").value;
}
}
}

</script>
</head>
<body>

<form name=f1 method=post>
<input type=text name=t1 id="t1" onkeyup='change_title(event)';>

</form>

</body>
</html>

Further readings
referrer: Getting the referrer of the browser to know how the visitor has arrived
title: Managing the title of the page
url: Collecting the full script path or URL by document object
lastModified: Last Modified date & time of the file or page
domain: domain name of the URL or site using this script
write: sening output text to browser by using document.write


Sections
PHP
JavaScript
ASP
HTML
SQL
Photoshop
Articles SEO
Document Object
Subscribe
Submit your email address and receive article and product notifications. Your email is safe with us.