By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,299 Members | 1,247 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,299 IT Pros & Developers. It's quick & easy.

How to change the title using JavaScript

P: 16
I want to change the title of HTML file using Javascript that the title will be like,

(the h1 tag of the document)+"Text"
Jan 23 '12 #1

✓ answered by ranjaniVinsInfo

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <script type="text/javascript">
  5. function fun()
  6.     {    
  7.         document.title = "Text - " + document.getElementById("MyID").innerHTML;
  8.     }
  9. </script>
  10. <title></title>
  11. <meta charset="utf-8" />
  12. </head>
  13. <body onload="fun()">
  14. <div id="fb-root"></div>
  15. <div id="wrapper">
  16.     <section id="mainsection">
  17.     <article title="Download PC games for free">
  18.         <header>
  19.             <h1 id="MyID">Testing</h1>
  20.            </header>
  21.     </article>
  22.     </section>
  23. </body>
  24. </html>
---- This is the Updated Code. Use it.It will Work.Thanks

Share this Question
Share on Google+
16 Replies


Dormilich
Expert Mod 5K+
P: 8,639
what have you tried so far?
Jan 23 '12 #2

P: 34
When You want to change the title. If the Document ready event or another event?
Jan 23 '12 #3

P: 16
I have tried

document.title = document.GetItemByTagName("h1") + "Text";
Jan 23 '12 #4

P: 34
Do it with "id" of the title tag.
Jan 23 '12 #5

P: 16
not working
but when I give:
document.title = document.getElementById("heading") + " - text";
It gives:
null - text
Jan 23 '12 #6

P: 34
Please Send Your Html Code
Jan 23 '12 #7

P: 34
document.title = document.getElementById("heading").value + " - text";
Please update your code like this.


you miss the .value with document.getElementById("heading")
Jan 23 '12 #8

Dormilich
Expert Mod 5K+
P: 8,639
you miss the .value with document.getElementById("heading")
that only works if that element has a value property, which only form control elements have (input, select, option).

nevertheless, our assumptions are useless without the according HTML code.
Jan 23 '12 #9

P: 16
Here is the html file
Attached Files
File Type: zip test.zip (382 Bytes, 50 views)
Jan 23 '12 #10

P: 34
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <script type="text/javascript">
  5. function fun()
  6.     {    
  7.         document.title = "Text - " + document.getElementById("MyID").innerHTML;
  8.     }
  9. </script>
  10. <title></title>
  11. <meta charset="utf-8" />
  12. </head>
  13. <body onload="fun()">
  14. <div id="fb-root"></div>
  15. <div id="wrapper">
  16.     <section id="mainsection">
  17.     <article title="Download PC games for free">
  18.         <header>
  19.             <h1 id="MyID">Testing</h1>
  20.            </header>
  21.     </article>
  22.     </section>
  23. </body>
  24. </html>
---- This is the Updated Code. Use it.It will Work.Thanks
Jan 23 '12 #11

P: 34
You use innerHTML attribute for the h1 tag. Because it have not the value attribute
Jan 23 '12 #12

Dormilich
Expert Mod 5K+
P: 8,639
Because it have not the value attribute
<select> elements don't have a value attribute either, yet they have a value property.
Jan 23 '12 #13

P: 34
Thanks Dormilich...! Sorry to Say Attribute. Because h1 tag can't have innerHTML as a attribute.It's a Property.but I Forget to Say Correctly...
Jan 23 '12 #14

Dormilich
Expert Mod 5K+
P: 8,639
that ain't it either. there is actually no HTML element that has an innerHTML attribute.

the crucial thing to understand is that the browser takes the HTML source code and generates a tree from which it renders the output. the JavaScript engine also uses this tree to create its own tree of the page. it may or may not use the attributes of the elements and even attach properies of its own (one of those being innerHTML). therefore you have to learn/look up the API that JavaScript uses to interact with the web page (or rather its rendering). one of those APIs is called DOM.
Jan 23 '12 #15

P: 34
Thanks Friend. You post Conformly help For me to know More about DOM.
Jan 23 '12 #16

P: 16
Thank you all for the help
Jan 23 '12 #17

Post your reply

Sign in to post your reply or Sign up for a free account.