mixing innerHTML and replaceChild - no good ...

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Micha³ Kurowski
    #1

    mixing innerHTML and replaceChild - no good ...

    What I've got:

    1) a page with a "window.open('s ome_html', ...)"

    2) "some_html" with basically this:

    <body onload="documen t.body.innerHTM L=FillIt('some_ id')"></body>

    3) a script:

    function FillIt(my_id) {
    var inner = window.opener.d ocument.getElem entById(my_id). cloneNode(true) ;

    var a = document.create Element('a');
    a.setAttribute( 'title', 'Close this window');
    a.setAttribute( 'href', 'javascript:sel f.close()');
    var img = document.create Element('img');
    img.setAttribut e('src', 'some_image');
    img.setAttribut e('alt', 'pop_down');
    a.appendChild(i mg);

    inner.replaceCh ild(a, inner.getElemen tById('popup')) ;
    return inner.innerHTML ;
    }

    This won't work. For sure I am doing something dumb in here (I'm a
    newbie) but I think "innerHTML" just won't work with "replaceChi ld".

    Please note there's only one 'popup' ID in my original DOM tree (it's
    a table) and no, I'd not like to iterate on all the table elements just
    to put it together in the end ...

    Looking for some advise.
    Thanks,

    --
    Michal Kurowski
    <mkur@poczta.ga zeta.pl>
    Tags: None
    • DU
      #2
      Re: mixing innerHTML and replaceChild - no good ...

      Michał Kurowski wrote:
      [color=blue]
      > What I've got:
      >
      > 1) a page with a "window.open('s ome_html', ...)"
      >
      > 2) "some_html" with basically this:
      >
      > <body onload="documen t.body.innerHTM L=FillIt('some_ id')"></body>
      >
      > 3) a script:
      >
      > function FillIt(my_id) {
      > var inner = window.opener.d ocument.getElem entById(my_id). cloneNode(true) ;
      >[/color]

      Why do you clone the node if you want to replace one of its child? I
      don,t see your code (whole document) here, so I don't understand this.
      [color=blue]
      > var a = document.create Element('a');[/color]

      I'd recommend to choose better identifiers when working with dynamically
      DOM created elements. I personally use obj as a prefix or DOMobj.
      [color=blue]
      > a.setAttribute( 'title', 'Close this window');[/color]

      It is known, recognized to avoid resorting to setAttribute when there is
      already an DOM 2 HTML attribute which can be used. Often, such DOM 2
      attribute will work much better.

      a.title = "Close this window";
      Document Object Model HTML
      http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-78276800

      [color=blue]
      > a.setAttribute( 'href', 'javascript:sel f.close()');[/color]

      a.onclick = new Function ("evt", "if(self.close( )) {self.close();} ;");
      [color=blue]
      > var img = document.create Element('img');
      > img.setAttribut e('src', 'some_image');[/color]

      img.src = "some_image ";
      [color=blue]
      > img.setAttribut e('alt', 'pop_down');[/color]

      Document Object Model HTML
      http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-95636861

      [color=blue]
      > a.appendChild(i mg);
      >
      > inner.replaceCh ild(a, inner.getElemen tById('popup')) ;[/color]

      inner is not the real node: inner is a copy, a clone of the node.

      What was wrong with calling a function to do this in the opener, not in
      the popup?
      In the opener:
      var objParentNode = document.getEle mentById("some_ id");
      (...your code here...)
      and then
      objParentNode.r eplaceChild(a, document.getEle mentById("popup "));
      [color=blue]
      > return inner.innerHTML ;
      > }
      >
      > This won't work. For sure I am doing something dumb in here (I'm a
      > newbie) but I think "innerHTML" just won't work with "replaceChi ld".
      >
      > Please note there's only one 'popup' ID in my original DOM tree (it's
      > a table) and no, I'd not like to iterate on all the table elements just
      > to put it together in the end ...
      >
      > Looking for some advise.
      > Thanks,
      >[/color]

      It's harder to see what could be wrong without seeing all the code and
      what is involved in your window.

      DU

        Comment

        • DU
          #3
          Re: mixing innerHTML and replaceChild - no good ...

          DU wrote:

          [color=blue]
          >[color=green]
          >> a.setAttribute( 'href', 'javascript:sel f.close()');[/color]
          >
          >
          > a.onclick = new Function ("evt", "if(self.close( )) {self.close();} ;");
          >[/color]

          This can not really work since the link has no href value. I'd suggest
          to use a real button (an HTML button) instead since such current "link"
          is a browser action, a browser command and not a resource to retrieve
          and to load and then to code the onclick event. Like this:

          var objButton = document.create Element("button ");
          objButton.type = "button";
          objButton.oncli ck = new Function("evt", "if(self.close( ))
          {self.close();} ;");
          objButton.appen dChild(document .createTextNode ("Close this window"));

          DU

            Comment

            • Micha³ Kurowski
              #4
              Re: mixing innerHTML and replaceChild - no good ...

              DU <drunclear@hotw ipethismail.com > wrote:[color=blue]
              >
              > Why do you clone the node if you want to replace one of its child? I
              > don,t see your code (whole document) here, so I don't understand this.[/color]

              OK, I was not clear enough, see below, please.
              Cloning is just of the things I tried ...
              It doesn't change much.

              [snip]

              Thanks a lot for info on W3C attribute names.
              [color=blue]
              > What was wrong with calling a function to do this in the opener, not in
              > the popup?
              > In the opener:
              > var objParentNode = document.getEle mentById("some_ id");
              > (...your code here...)
              > and then
              > objParentNode.r eplaceChild(a, document.getEle mentById("popup "));[/color]


              This will break the whole purpose of the thing.

              What I try to do is to use an "onload" event in a new window to copy
              the whole table from the opener. I'm sure it must be done in the new
              window ...

              How would you let it know about the "objParentN ode" ?
              Pehaps "window.ope ner" could be used in some other way ?

              Thanks.

              --
              Michal Kurowski
              <mkur@poczta.ga zeta.pl>

                Comment

                Previous template Next
                Working...