DOM: how to append to node'd contents?

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • J Krugman

    DOM: how to append to node'd contents?




    This question refers to the DOM. I would like to dynamically append
    some small amount of text to the all-text content of a <pre> node.
    I suppose that I could extract the existing content, and replace
    the <pre> node in question with a new <pre> node that has the
    extended content. But the existing content is longish, and it
    seems to me wasteful to rewrite it all just to have a small amount
    of text tacked on to the end. Is there a way to simply append the
    new text to the node's contents?

    TIA,

    jill

    --
    To s&e^n]d me m~a}i]l r%e*m?o\v[e bit from my a|d)d:r{e:s]s.

  • Andrew Urquhart

    #2
    Re: how to append to node'd contents?

    *J Krugman* wrote:[color=blue]
    > This question refers to the DOM. I would like to dynamically append
    > some small amount of text to the all-text content of a <pre> node.
    > I suppose that I could extract the existing content, and replace
    > the <pre> node in question with a new <pre> node that has the
    > extended content. But the existing content is longish, and it
    > seems to me wasteful to rewrite it all just to have a small amount
    > of text tacked on to the end. Is there a way to simply append the
    > new text to the node's contents?[/color]

    Not sure why you can't append another text node to the pre element?
    E.g.:

    function AppendText(strI d, strTxt) {
    var objNode = document.getEle mentById(strId) ;
    if (objNode) {
    var objTextNode = document.create TextNode(strTxt );
    objNode.appendC hild(objTextNod e);
    }
    }


    <pre id="myNode" onclick="Append Text('myNode', 'It was\r\nthe fact'
    +' that the cave was in the middle of Islington and there wasn\'t\r\n'
    +'a bus due for two million years.')">Life, the Universe, and Everything
    for Sally
    Chapter 1
    The regular early morning yell of horror was the sound of Arthur Dent
    waking up and suddenly remembering where he was. It wasn't just that
    the cave was cold, it wasn't just that it was damp and smelly. </pre>
    --
    Andrew Urquhart
    - FAQ: www.jibbering.com/faq/
    - Archive: www.google.com/groups?q=comp.lang.javascript
    - Contact me: http://andrewu.co.uk/contact/


    Comment

    • DU

      #3
      Re: DOM: how to append to node'd contents?

      J Krugman wrote:[color=blue]
      > This question refers to the DOM. I would like to dynamically append
      > some small amount of text to the all-text content of a <pre> node.
      > I suppose that I could extract the existing content, and replace
      > the <pre> node in question with a new <pre> node that has the
      > extended content. But the existing content is longish, and it
      > seems to me wasteful to rewrite it all just to have a small amount
      > of text tacked on to the end. Is there a way to simply append the
      > new text to the node's contents?
      >
      > TIA,
      >
      > jill
      >[/color]


      W3C DOM 2 CharacterData appendData() method is what you're looking for
      here and appendData() is supported by almost all browsers (MSIE 5+ Mac
      and Windows, NS 6+, Mozilla 1.x, Firefox 0.5+, Safari 1.x, K-meleon
      0.7+, Opera 7.x, Galeon 1.x, Konqueror 3.x, etc.) and is a W3C web
      standard method.

      Assuming you have:

      <pre id="idPre"> ... </pre>

      then

      document.getEle mentById("idPre ").childNod es[0].appendData(" some
      additional text");

      will do the trick.
      You can use other DOM 2 CharacterData methods like insertData() to have
      more control.

      DU

      Comment

      • J Krugman

        #4
        Re: DOM: how to append to node'd contents?

        In <ceuqn2$esm$1@n ews.eusc.inter. net> DU <drunclear@hotW IPETHISmail.com > writes:
        [color=blue]
        >J Krugman wrote:[color=green]
        >> This question refers to the DOM. I would like to dynamically append
        >> some small amount of text to the all-text content of a <pre> node.
        >> I suppose that I could extract the existing content, and replace
        >> the <pre> node in question with a new <pre> node that has the
        >> extended content. But the existing content is longish, and it
        >> seems to me wasteful to rewrite it all just to have a small amount
        >> of text tacked on to the end. Is there a way to simply append the
        >> new text to the node's contents?
        >>
        >> TIA,
        >>
        >> jill
        >>[/color][/color]

        [color=blue]
        >W3C DOM 2 CharacterData appendData() method is what you're looking for
        >here and appendData() is supported by almost all browsers (MSIE 5+ Mac
        >and Windows, NS 6+, Mozilla 1.x, Firefox 0.5+, Safari 1.x, K-meleon
        >0.7+, Opera 7.x, Galeon 1.x, Konqueror 3.x, etc.) and is a W3C web
        >standard method.[/color]
        [color=blue]
        >Assuming you have:[/color]
        [color=blue]
        ><pre id="idPre"> ... </pre>[/color]
        [color=blue]
        >then[/color]
        [color=blue]
        >document.getEl ementById("idPr e").childNod es[0].appendData(" some
        >additional text");[/color]
        [color=blue]
        >will do the trick.
        >You can use other DOM 2 CharacterData methods like insertData() to have
        >more control.[/color]

        Thank you. That was very helpful.

        jill

        --
        To s&e^n]d me m~a}i]l r%e*m?o\v[e bit from my a|d)d:r{e:s]s.

        Comment

        Working...