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 10 of 10
  1. #1
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,960
    Thanks
    0
    Thanked 236 Times in 233 Posts

    adding non-breaking spaces in createTextNode

    how to add non-breaking spaces in createTextNode?
    i've tried these 3 ways but to no avail:
    objText = document.createTextNode(" "+arrHist[i]+" ");
    objText = document.createTextNode("  "+arrHist[i]+"  ");
    objText = document.createTextNode("  "+arrHist[i]+"  ");

  • #2
    New Coder
    Join Date
    Jul 2002
    Posts
    73
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, the reason the last two don't work is because using the
    createTextNode and innerText method and attribute (respectively),
    both escape the characters automatically, but I would think, that
    being the case, that the first method would work, are you sure it
    doesn't? I tried it using IE6, and it worked fine.

    Try putting text in the element that the new Node will be appended
    to, before the end tag. Using the first method, it should work.


    Guardian

  • #3
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,960
    Thanks
    0
    Thanked 236 Times in 233 Posts
    if i insert several spaces before and after the text, it just inserts nothing or maybe 1 space but if in between the text, it's ok. here's the snippet:

    Code:
    objText = document.createTextNode("     "+(i+1)+"          "+arrHist[i]+"     ");
    objTD.appendChild(objText);
    objTR.appendChild(objTD);
    objTbl.appendChild(objTR);
    im actually filling text inside the cell of a table and i want to have 2-3 spaces before and after the text.

    see the snapshot.
    Attached Thumbnails Attached Thumbnails adding non-breaking spaces in createTextNode-menu.jpg  

  • #4
    New Coder
    Join Date
    Jul 2002
    Posts
    73
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hmmm...

    I'm assuming that you are using Mozilla or another browser with
    the same base?

     Well, I tried using innerHTML, but it doesn't seem to take the +=
    operator very well.

     But I did figure out why you can't add extra white-space
    with the createTextNode() method. The browser treats it like a
    normal Text-Node and truncates it, so you either have to stick with
    the W3C deprecated innerHTML throughout the TD, or you can
    try using CSS to center the contents.

    But try this for innerHTML

    Code:
    var mtstring = "Hello!"
    
    objTbl = document.getElementById("idname")
    var objTR = document.createElement ("tr")
    var objTD = document.createElement ("td")
    var objText = document.createTextNode ("Hello")
    objTD.appendChild(objText)
    
    objTR.appendChild(objTD)
    objTbl.appendChild(objTR)
    
    objCell = objTbl.childNodes[1].firstChild
    var temp = objCell.innerHTML
    var space = "   "
    var temp = space + temp + space
    objCell.innerHTML = temp
    It's primitive, but it seems to work OK in Mozilla.

    Guardian
    Last edited by Guardian23; 09-17-2002 at 07:30 AM.

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Posts
    185
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You can use the escape sequence '\u' in a string with the Unicode value for a non-breaking space:

    var textNode = document.createTextNode("\u00a0");

      and   are strictly HTML (or XML) notations. In JavaScript, you need to use an escape sequence starting with '\\' for special characters in strings. See http://developer.netscape.com/docs/m...t.html#1008368
    Last edited by BrainJar; 09-19-2002 at 04:08 PM.

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,960
    Thanks
    0
    Thanked 236 Times in 233 Posts
    thanks BrainJar, but it still doesn't work when inserting Unicode escape sequence for space (\u0020) before and after the text, it only works when inserted in between.
    Guardian's solution would be my last resort.

    Thanks!

  • #7
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    In theory, the DOM1 Core defines a createEntityReference method of the document object.

    IE does not include the method, while Gecko has it, but throws an NS_ERROR_DOM_NOT_SUPPORTED_ERR when trying to use it.
    Doesn't exist in Opera 6 either.

    http://bugzilla.mozilla.org/show_bug.cgi?id=9850
    is the most relevant bug I found for Moz's support.

    This is one of the few DOM1 methods that it seems no browser implements (and considering Mozilla supports some DOM3, this surprises me).

  • #8
    New Coder
    Join Date
    Jul 2002
    Posts
    73
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Guardian's solution would be my last resort.
      I should certainly hope so! As it's far from professional.

     But I would think there would be something you could do with css.
    Perhaps by creating a class with wide margins on both sides.

    Guardian

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Posts
    185
    Thanks
    0
    Thanked 0 Times in 0 Posts
    In HTML, spaces in text always get compressed. If you had a hundred spaces, or even a million, the browser still displays it as one single space. For example, this in your HTML code:

    Code:
    <span>"                    text                    "</span>
    displays as this on your page:

    Code:
    " text "
    The &amp;nbsp; character (\u00a0) is not the same as the regular space character (\u0020}. Non-breaking spaces will not be compressed by the browser. Each one takes up some space.

    So if you want to force some spacing between the edge of a cell and the text, you can add &amp;nbsp; characters to either side of the text. But use \u00a0, not \u0020.

    Or, you can also use CSS, setting the padding style on the cell:

    objTD.appendChild(objText);
    objTD.style.paddingLeft = "1em";
    objTD.style.paddingRight = "1em";

    which can give you more precise control.
    Last edited by BrainJar; 09-20-2002 at 06:13 AM.

  • #10
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,960
    Thanks
    0
    Thanked 236 Times in 233 Posts
    Thanks BrainJar, it now works when I used \u00a0


  •  

    Posting Permissions

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