Results 1 to 5 of 5

Thread: using document.write()

  1. #1
    Join Date
    Sep 2005
    Location
    Connecticut
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default using document.write()

    Hello. I was wondering how you would use the "document.write('...') function in JavaScript to only write to a certain div? Or any other positioning element? The only function I know of with this ability is the "getElementById('..')", but i am a little fuzzy on that.

    If you want to know why I want to know, I wish to create a script that would publish a text fields(s') contents onto a web page instantly. This might be done with PHP, but if it is, please give me the entire code as I know nothing at all about PHP.

    Thank you in advance.

  2. #2
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    What you want is the innerHTML property.
    document.getElementById("insertDivIdHere").innerHTML += "whatever";
    Look out for:
    Validity - the innerHTML property is very strict, and if your HTML doesn't make sense, the browser will take steps to correct it. Not usually what you want. For example, if you write:
    Code:
    var e = document.getElementById("insertDivIdHere");
    e.innerHTML += "<p>";
    e.innerHTML += "Text";
    e.innerHTML += "</p>";
    The text will be outside the paragraph. The browser will correct for the <p> by closing the tag, then "correct" your closing tag by removing it. Always write your HTML into a variable first.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  3. #3
    Join Date
    Sep 2005
    Location
    Connecticut
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Twey
    The text will be outside the paragraph. The browser will correct for the <p> by closing the tag, then "correct" your closing tag by removing it. Always write your HTML into a variable first.
    Umm, i really didn't understand what you said, so are you saying I should create a variable like var html would be the HTML code? Or are you saying that instead of putting the <p>, the text, and the </p> in seperate innerHTML's, I should put them in the same one?

  4. #4
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Wizard13335
    Umm, i really didn't understand what you said, so are you saying I should create a variable like var html would be the HTML code?
    I'm not quite sure what you said there, either.

    Or are you saying that instead of putting the <p>, the text, and the </p> in seperate innerHTML's, I should put them in the same one?
    In the code Twey posted, the markup will be added to the same innerHTML property, but it will be done one step at a time.

    The first concatenation

    Code:
    e.innerHTML += '<p>';
    will be considered to be an empty paragraph; reading the property should yield '...<p></p>'. The next concatenation

    Code:
    e.innerHTML += 'Text';
    will add text after that paragraph, yielding '...<p></p>Text'. The final concatenation would be considered invalid markup because there is no opening p tag.

    To avoid this, the concatenation should be a single, atomic operation. In the simplest case, this would be:

    Code:
    e.innerHTML += '<p>Text</p>';
    If you are to build the string, then it's best to create an array, which is later joined and assigned:

    Code:
    var content = ['<p>',
                   'Text',
                   '</p>'];
    
    if(condition) {
      content.push('<p>Some more text</p>');
    }
    
    e.innerHTML += content.join('');
    The reason for doing it this way is that direct string concatenation is relatively slow. Though the join method does indeed concatenate each array element, it does so in native machine code, which will be optimised and therefore quicker. The other reason is that the Array.prototype methods can add a lot of flexibility whilst building each part of the string.

    Mike


    Note that the Array.prototype.push method isn't implemented in earlier JScript versions, so it may need to be emulated:

    Code:
    if('function' != typeof Array.prototype.push) {
      Array.prototype.push = function(v) {
        var i = this.length >>> 0,
            j = 0,
            n = arguments.length;
    
        while(j < n) {this[i++] = arguments[j++];}
        return this.length = i;
      };
    }

  5. #5
    Join Date
    Sep 2005
    Location
    Connecticut
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Oh, now i see. Thank you for your help.

Bookmarks

Posting Permissions

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