'document is not an object' when trying to change <DIV> content

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Catherine Lynn Smith
    #1

    'document is not an object' when trying to change <DIV> content

    I am creating a webpage with dhtml <DIV> layers and I want a link on
    one layer to modify the content on another but I seem to keep running
    into errors.

    Basically I create a layer in the middle of the screen that initially
    comes up with a gif image of a house:

    <!-- start "house" layer definition for center of screen -->
    <DIV id="house" style="position :absolute; left:140px; top:137px;
    width:510px; height:325px; z-index:2"><img src="images/house.gif"
    width="510" height="325"></DIV>
    <!-- end "house" layer definition -->

    In another portion of the browser I have a navigation bar built in
    another <DIV> layer that includes a number of links:

    <!-- start "rtnav" layer definition for lower right navigation links
    -->
    <DIV id="rtnav" style="position :absolute; left:600px; top:400px;
    width:200px; height:100px; z-index:13">
    <SPAN id="members" class="rightnav "><a href="javascrip t:void();"
    onClick="gotoMe mbers();">Membe r Login</a></SPAN>
    </DIV>
    <!-- end "rtnav" layer definition -->

    In the <HEAD> portion, I have a <SCRIPT> section that includes the
    function gotoMembers() {} that I am hoping can either use
    document.write( '...'); or perhaps a load("members.h tm",800);
    {preferred} to change the existing content (the gif of a house) to a
    small login form:

    function gotoMembers() { // pop up member dialog in blueCenter
    // Example is being tested in Internet Explorer. I have also used
    document.all["house"] and done
    // similar testing in Netscape using document.layers["house"] without
    success.

    // - try using 'load' method to load an external page
    // document.getEle mentById("house ").load("member s.htm",800);

    // - using document.write( '...');
    document.getEle mentById("house ").document.ope n();
    document.getEle mentById("house ").document.wri te('this is a test, this
    is only a test - please work!!!');
    document.getEle mentById("house ").document.clo se();
    }

    Whenever I use the 'document.metho d();' it says "{node}.documen t is
    not an object" where {node} is the method I used to retrieve the DIV
    layer ID. I have confirmed that I can use all three constructs to
    change the style.visibilit y='hidden' so it's not something else
    somewhere and I have tried this in both Netscape 7.1 and Internet
    Explorer Version: 6.0.2800.1106

    What am I missing here?

    As stated, my preference would be to load a seperate .htm file
    including mark-up into the target frame "house" but none of the
    document properties appear to be defined for that layer. Any help
    would be appreciated.

    Kathy
    Tags: None
    • Janwillem Borleffs
      #2
      Re: 'document is not an object' when trying to change &lt;DIV&gt; content


      "Catherine Lynn Smith" <klynntg@hotmai l.com> schreef in bericht
      news:5fb632c2.0 309111229.4ea0a ac4@posting.goo gle.com...[color=blue]
      >
      > function gotoMembers() { // pop up member dialog in blueCenter
      > // Example is being tested in Internet Explorer. I have also used
      > document.all["house"] and done
      > // similar testing in Netscape using document.layers["house"] without
      > success.
      >
      > // - try using 'load' method to load an external page
      > // document.getEle mentById("house ").load("member s.htm",800);
      >
      > // - using document.write( '...');[/color]

      document.write can only be used with <layers /> in Netscape 4 when the page
      is already loaded. document.getEle mentById(...).l oad(...) won't work either.

      You could use an iframe instead voor Netscape 7/Mozilla and IE if you want
      to include content URL based, but if you want to write to the div, you
      should use its innerHTML property:

      IE 4:
      document.all['divID'].innerHTML = stringHTML;

      IE 5+/Mozilla/Netscape 7+/Opera 7:
      document.getEle mentById('divID ').innerHTML = stringHTML;


      JW



        Comment

        • son3mendo
          #3
          Re: 'document is not an object' when trying to change &lt;DIV&gt; content



          In have understood well (I hope!), you'd like to change the content
          of a tag div (an img) clicking another div, look if this is suitable for
          you, using DOM:


          <html>
          <head><title>Tr y</title>
          <script>
          function change() {
          var div = document.getEle mentById("first Div");
          var old = div.childNodes[0];
          var xxx = document.create Element("form") ;
          var son = document.create Element("input" );
          div.replaceChil d(xxx, old);
          div.childNodes[0].appendChild(so n).setAttribute ("type", "text");
          }
          </script>
          </head>
          <body>
          <div id="firstDiv">< img id="whatever" src="fotografie .jpg" /></div>
          <div id="another"onC lick="change(); ">clickme!</div>
          </body>

          hope it could help you!!!

          ciao

          g. paolini

            Comment

            • Catherine Lynn Smith
              #4
              Re: 'document is not an object' when trying to change &lt;DIV&gt; content

              OK - I will try that - also, is there a way to do this by retreiving
              the new content from another stand-alone html file? (e.g.
              "members.ht m")

              KL

              son3mendo <son3mendo@_NS_ excite.it> wrote in message news:<pan.2003. 09.11.21.13.33. 419877@_NS_exci te.it>...[color=blue]
              > In have understood well (I hope!), you'd like to change the content
              > of a tag div (an img) clicking another div, look if this is suitable for
              > you, using DOM:
              >
              >
              > <html>
              > <head><title>Tr y</title>
              > <script>
              > function change() {
              > var div = document.getEle mentById("first Div");
              > var old = div.childNodes[0];
              > var xxx = document.create Element("form") ;
              > var son = document.create Element("input" );
              > div.replaceChil d(xxx, old);
              > div.childNodes[0].appendChild(so n).setAttribute ("type", "text");
              > }
              > </script>
              > </head>
              > <body>
              > <div id="firstDiv">< img id="whatever" src="fotografie .jpg" /></div>
              > <div id="another"onC lick="change(); ">clickme!</div>
              > </body>
              >
              > hope it could help you!!!
              >
              > ciao
              >
              > g. paolini[/color]

                Comment

                Previous template Next
                Working...