How to change the title using JavaScript

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • tharindu96
    New Member
    • Jan 2012
    • 16

    How to change the title using JavaScript

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

    (the h1 tag of the document)+"Text "
  • Dormilich
    Recognized Expert Expert
    • Aug 2008
    • 8694

    #2
    what have you tried so far?

    Comment

    • ranjaniVinsInfo
      New Member
      • Jan 2012
      • 34

      #3
      When You want to change the title. If the Document ready event or another event?

      Comment

      • tharindu96
        New Member
        • Jan 2012
        • 16

        #4
        I have tried

        document.title = document.GetIte mByTagName("h1" ) + "Text";

        Comment

        • ranjaniVinsInfo
          New Member
          • Jan 2012
          • 34

          #5
          Do it with "id" of the title tag.

          Comment

          • tharindu96
            New Member
            • Jan 2012
            • 16

            #6
            not working
            but when I give:
            document.title = document.getEle mentById("headi ng") + " - text";
            It gives:
            null - text

            Comment

            • ranjaniVinsInfo
              New Member
              • Jan 2012
              • 34

              #7
              Please Send Your Html Code

              Comment

              • ranjaniVinsInfo
                New Member
                • Jan 2012
                • 34

                #8
                document.title = document.getEle mentById("headi ng").value + " - text";
                Please update your code like this.


                you miss the .value with document.getEle mentById("headi ng")

                Comment

                • Dormilich
                  Recognized Expert Expert
                  • Aug 2008
                  • 8694

                  #9
                  you miss the .value with document.getEle mentById("headi ng")
                  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.

                  Comment

                  • tharindu96
                    New Member
                    • Jan 2012
                    • 16

                    #10
                    The HTML file

                    Here is the html file
                    Attached Files

                    Comment

                    • ranjaniVinsInfo
                      New Member
                      • Jan 2012
                      • 34

                      #11
                      Code:
                      <!DOCTYPE HTML>
                      <html>
                      <head>
                      <script type="text/javascript">
                      function fun()
                      	{	
                      		document.title = "Text - " + document.getElementById("MyID").innerHTML;
                      	}
                      </script>
                      <title></title>
                      <meta charset="utf-8" />
                      </head>
                      <body onload="fun()">
                      <div id="fb-root"></div>
                      <div id="wrapper">
                          <section id="mainsection">
                      	<article title="Download PC games for free">
                          	<header>
                              	<h1 id="MyID">Testing</h1>
                             	</header>
                          </article>
                          </section>
                      </body>
                      </html>
                      ---- This is the Updated Code. Use it.It will Work.Thanks
                      Last edited by Dormilich; Jan 23 '12, 03:01 PM.

                      Comment

                      • ranjaniVinsInfo
                        New Member
                        • Jan 2012
                        • 34

                        #12
                        You use innerHTML attribute for the h1 tag. Because it have not the value attribute

                        Comment

                        • Dormilich
                          Recognized Expert Expert
                          • Aug 2008
                          • 8694

                          #13
                          Because it have not the value attribute
                          <select> elements don't have a value attribute either, yet they have a value property.

                          Comment

                          • ranjaniVinsInfo
                            New Member
                            • Jan 2012
                            • 34

                            #14
                            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...

                            Comment

                            • Dormilich
                              Recognized Expert Expert
                              • Aug 2008
                              • 8694

                              #15
                              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.

                              Comment

                              Working...