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 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question How do I format text

    I want to display either "text 1" or "text 2" after a button has been pressed.
    The text is long (maybe 300 words). I've used the following to generate it.

    var myDiv = document.getElementById("displayText");

    myDiv.appendChild(document.createTextNode("This is the text part 1"));
    myDiv.appendChild(document.createTextNode("This is the text part 2"));

    The trouble is it just displays the 2 texts strung together. I cant get any newlines or different fonts etc. Can anyone give advice please

  • #2
    Regular Coder feras_wilson's Avatar
    Join Date
    Jul 2005
    Location
    Sweden
    Posts
    129
    Thanks
    1
    Thanked 0 Times in 0 Posts
    You mean like this?: ||
    v
    Code:
    <p>text text text text. text text text. txet text text.
    You dont want "txet" to be viewed?
    Exp:
    PHP
    .NET

  • #3
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How do I format text

    The text is in the following commands
    myDiv.appendChild(document.createTextNode("This is the text part 1"));
    myDiv.appendChild(document.createTextNode("This is the text part 2"));

    You can not put any markup in (e.g. "<p>This is the text part 1<br>" as it ignores the <p> <br> and just treats it as text when it is displayed by the HTML - <div id="displayText"></div>

  • #4
    Master Coder
    Join Date
    Feb 2003
    Location
    Umeå, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    DOM text nodes are considered preparsed. This means that if you want a newline, you can add a newline using the JavaScript string escape mechanism, '\n'. Another solution is to insert a br element.


    If you want to change fonts or other style you need to create an element which has a style (or which has a class that will be styled from CSS present in the document already) and add the text you want to give that style as a child node to that element.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #5
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I am not an experienced javascript programmer but have tried to put the \n in the text as follows
    myDiv.appendChild(document.createTextNode("This is the text part 1 \n"));
    myDiv.appendChild(document.createTextNode("This is the text part 2"));

    this did not have any effect and produced the following line
    This is the text part 1 This is the text part 2

    It did not display the \n which I expected it would do. If I had put a <p> in the text it would have just displayed it

  • #6
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by ingie001 View Post
    I am not an experienced javascript programmer but have tried to put the \n in the text as follows
    myDiv.appendChild(document.createTextNode("This is the text part 1 \n"));
    myDiv.appendChild(document.createTextNode("This is the text part 2"));

    this did not have any effect and produced the following line
    This is the text part 1 This is the text part 2

    It did not display the \n which I expected it would do. If I had put a <p> in the text it would have just displayed it
    I am not an experienced javascript programmer but have tried to put the \n in the text as follows
    myDiv.appendChild(document.createTextNode("This is the text part 1 \n"));
    myDiv.appendChild(document.createTextNode("This is the text part 2"));

    this did not have any effect and produced the following line
    This is the text part 1 This is the text part 2

    It did not display the \n which I expected it would do. If I had put a <p> in the text it would have just displayed it

  • #7
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You do as liorean said and create a <br> node between the two like this:

    myDiv.appendChild(document.createTextNode("This is the text part 1"));
    myDiv.appendChild(document.createElement("br"));
    myDiv.appendChild(document.createTextNode("This is the text part 2"));

    david_kw

  • #8
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks David_KW - I needed it spelling out as you have done.


  •  

    Posting Permissions

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