Using document.write() to load javascript

Excuse my newb question. I'm still in the beginning stages of learning javascript. I'm not sure If I can accurately describe to you guys what i'm trying to do, but i'll try.

Is it possible to load a javascript file onto an html page?

for example. Twitter gave me code for there twitter widget, and it's a javascript widget. I want to be able to display it on my page using the document.write method. Is this possible. Here is an example.

This is the code they gave me.

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'search',
  search: '@blahblah',
  interval: 6000,
  title: 'Follow Me On Twitter',
  subject: 'blahblah',
  width: 180,
  height: 300,
  theme: {
    shell: {
      background: '#ebebeb',
      color: '#969396'
    },
    tweets: {
      background: '#ffffff',
      color: '#000000',
      links: '#bbbcbd'
    }
  },
  features: {
    scrollbar: false,
    loop: true,
    live: true,
    hashtags: true,
    timestamp: true,
    avatars: true,
    toptweets: true,
    behavior: 'default'
  }
}).render().start();
</script>

So, is it possible that I could write this to the html page like this?

document.write('<script src="http://widgets.twimg.com/j/2/widget.js"></script> '
    <script>
    'new TWTR.Widget({
      version: 2,
      type: 'search',
      search: 'blah',
      interval: 6000,
      title: 'Follow Me On Twitter',
      subject: '@blahBlah',
      width: 180,
      height: 300,
      theme: {
        shell: {
          background: '#ebebeb',
          color: '#969396'
        },
        tweets: {
          background: '#ffffff',
          color: '#000000',
          links: '#bbbcbd'
        }
      },
      features: {
        scrollbar: false,
        loop: true,
        live: true,
        hashtags: true,
        timestamp: true,
        avatars: true,
        toptweets: true,
        behavior: 'default'
      }
    }).render().start();
    </script> ');  

or what I have to write each script as a seperate line like this?

document.write('<script src="http://widgets.twimg.com/j/2/widget.js"></script> ');
<script>
document.write('new TWTR.Widget({
  version: 2,
  type: 'search',
  search: '@BigNotch',
  interval: 6000,
  title: 'Follow Me On Twitter',
  subject: 'BigNotch',
  width: 180,
  height: 300,
  theme: {
    shell: {
      background: '#ebebeb',
      color: '#969396'
    },
    tweets: {
      background: '#ffffff',
      color: '#000000',
      links: '#bbbcbd'
    }
  },
  features: {
    scrollbar: false,
    loop: true,
    live: true,
    hashtags: true,
    timestamp: true,
    avatars: true,
    toptweets: true,
    behavior: 'default'
  }
}).render().start();
</script> ');   
 }

I tried THIS, but DW gave me a syntax error. Here is the ENTIRE script i'm writing.

  <script type="text/JavaScript">
<!--
function changTwitter() {
var currentTime = new Date().getHours();    

 if (7 <= currentTime&&currentTime < 17) {

       document.write('<' + 'script>
new TWTR.Widget({
  version: 2,
  type: 'search',
  search: '@BigNotch',
  interval: 6000,
  title: 'Follow Me On Twitter',
  subject: 'BigNotch',
  width: 180,
  height: 300,
  theme: {
    shell: {
      background: '#242124',
      color: '#f0af4d'
    },
    tweets: {
      background: '#333333',
      color: '#c2c2c2',
      links: '#f7bc63'
    }
  },
  features: {
    scro开发者_开发知识库llbar: false,
    loop: true,
    live: true,
    hashtags: true,
    timestamp: true,
    avatars: true,
    toptweets: true,
    behavior: 'default'
  }
}).render().start();
</' + 'script> ');   
 }

 else {
      document.write('<' + 'script>
new TWTR.Widget({
  version: 2,
  type: 'search',
  search: '@BigNotch',
  interval: 6000,
  title: 'Follow Me On Twitter',
  subject: 'BigNotch',
  width: 180,
  height: 300,
  theme: {
    shell: {
      background: '#17d1ff',
      color: '#ff8fda'
    },
    tweets: {
      background: '#ededed',
      color: '#383838',
      links: '#ff8aed'
    }
  },
  features: {
    scrollbar: false,
    loop: true,
    live: true,
    hashtags: true,
    timestamp: true,
    avatars: true,
    toptweets: true,
    behavior: 'default'
  }
}).render().start();
</' + 'script> ');

  }

      }

---

You can do that, but you'll need to be sure that you break up the text </script> within the document.write call, because otherwise the browser will treat it as the end of the script tag that the document.write call is within. The usual way to do that is to either break the word up:

...blah blah blah</" + "script>");

or put a backslash in front of the forward slash:

...blah blah blah<\/" + "script>");

It is perhaps paranoid of me, but I do it (the first bit) for opening script tags as well.

In terms of whether you do it with one document.write call or two, it doesn't matter. document.write adds to the text stream that will be parsed by the HTML parser. It doesn't matter whether you write it all out at once or use a hundred individual calls to do it.

Update: Some points on the code you added to the question:

1. The code won't parse, you're using ' as the quote character for your document.write call, but you're also using it for strings within the code you're writing. Which means that the first ' within the code (which is after "type:") will end the document.write string.
2. Remember that document.write only works during the initial load of a page, as part of the parsing sequence. You can't call document.write later, in response to an event (or rather, if you do, the odds are very low that it will do what you want — it will try to replace the entire contents of the page). In the code you added to the question, you're defining a function changTwitter but never calling it. You'd have to call it to do anything.

Instead of outputting a completely different script, why not just use code within the script to adjust the color by time of day? Something like:

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
(function() {
    var currentTime = new Date().getHours()
        shellColor,
        shellBackground,
        tweetColor,
        tweetBackground,
        linkColor;    

    if (7 <= currentTime&&currentTime < 17) {
        shellColor = /*...whatever*/;
        shellBackground = /*...whatever*/;
        tweetColor = /*...whatever*/;
        tweetBackground = /*...whatever*/;
        linkColor = /*...whatever*/;
    }
    else {
        shellColor = /*...whatever*/;
        shellBackground = /*...whatever*/;
        tweetColor = /*...whatever*/;
        tweetBackground = /*...whatever*/;
        linkColor = /*...whatever*/;
    }
    new TWTR.Widget({
      version: 2,
      type: 'search',
      search: '@blahblah',
      interval: 6000,
      title: 'Follow Me On Twitter',
      subject: 'blahblah',
      width: 180,
      height: 300,
      theme: {
        shell: {
          background: shellBackground,
          color: shellColor
        },
        tweets: {
          background: tweetBackground,
          color: tweetColor,
          links: linkColor
        }
      },
      features: {
        scrollbar: false,
        loop: true,
        live: true,
        hashtags: true,
        timestamp: true,
        avatars: true,
        toptweets: true,
        behavior: 'default'
      }
    }).render().start();
})();
</script>

---

Just put the code in a separate javascript file, and include it with <script src="name_you_saved_it_under.js"></script> (put that in the <head> of whatever HTML document you want to include it in.

---

Using JQuery you could implement the following solution:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">

/**
 * Function to load funcions dynamically
 * by inserting a scrip tag into the head section
 *
 * @params      <String> path to script
 * @return        none.
 */
function load_script(src) {

    // docorate an empty elemend node with the correct 
    // script source and then append it to the head section
    $('<script><\/script>').attr('src', src).appendTo($('head')[0]);

}

</script>

PS: This script has not been test but should be close to what you need.

Hope this helps.