Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Dec 2013
    Posts
    2
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Unhappy Teaching myself javascript and I am stuck please help?

    Hi I am teaching myself javascript because I want to learn it. Below is my code for the html and javascript. When you click on the button it should change the current page to the new page with a background color. It doesn't. I check for javascript errors in the browser development and there are none so I am sure lost.
    Any help would be great!! I have been looking at this for 2 days and I am not seeing the problem:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <title>Using document.write() on the Current Window</title>
    <script src="../java/currentwindow.js" type="text/javascript"></script>
    </head>
    <body>
    <form>
    <input type="button" value="Replace content" onClick="reWrite"/>
    </form>
    <br />
    <a href="../index.html">Home</a>
    </body>
    </html>

    // JavaScript Document
    function reWrite() {
    //assemble content for new window
    var newContent="<html><head><title>A New Doc</title></head>";
    newContent+="<body style='background-color:#E6E6FA'><h1>This document is brand new.</h1>";
    newContent+="Click the Back button to see original document.";
    newContent+="</body></html>";
    //write HTML to new window document
    document.write(newContent);
    document.close(); //close layout stream
    }

    I do have javascript enabled so that when I view this in my browser it should work.
    thank you for helping me.
    (not so)Happy(right now)

  • #2
    Regular Coder
    Join Date
    Aug 2010
    Posts
    945
    Thanks
    19
    Thanked 205 Times in 203 Posts
    <input type="button" value="Replace content" onClick="reWrite"/>
    should be ...
    <input type="button" value="Replace content" onClick="reWrite()"/>

    Best of luck to you on learning JavaScript.
    Please post often, your learning experience
    documented here could be useful to other
    students. Remember to use descriptive
    titles for your posts.
    Last edited by DaveyErwin; 12-18-2013 at 11:17 PM.

  • Users who have thanked DaveyErwin for this post:

    happyboulder (12-18-2013)

  • #3
    New to the CF scene
    Join Date
    Dec 2013
    Posts
    2
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Yes! that was it. OMG I can't believe for 2 days I didn't see that. Thank you so much.

  • #4
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,454
    Thanks
    0
    Thanked 632 Times in 622 Posts
    You shouldn't be using document.write in your JavaScript - that was used with Netscape 4 but more modern browsers replaced it with a large range of document object model commands and also innerHTML.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    happyboulder (12-19-2013)

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    You should CLEARLY throw out whatever book/website you are using to teach yourself from.

    Anything still using document.write() is at least 10 years out of date.

    Start, instead, with Felgall's "Learn Modern JavaScript".

    Here's a START in that direction, though Felgall would surely find stuff in my code that he would consider a bit old-hat.
    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <title>AVOIDING the use of horribly OBSOLETE document.write()</title>
    <style type="text/css">
    * { margin: 0px; }
    </style>
    </head>
    <body>
    <div id="original">
        <input type="button" id="doReplace" value="Replace content" />
        <br />
        <a href="../index.html">Home</a>
    </div>
    
    <script type="text/javascript">
    (
      function( )
      {
        document.getElementById("doReplace").onclick =
          function( ) 
          {
              document.title = "Replaced Doc Content";
              document.getElementById("original").style.display = "none";
              var content = document.createElement("div");
              content.id = "newContent";
              var h = document.createElement("h1");
              h.appendChild( document.createTextNode("This document is now revised!") );
              content.appendChild( h );
              document.body.appendChild( content );
              document.body.style.backgroundColor = "#E6E6FA";
          }
      }
    )();
    </script>
    
    </body>
    </html>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •