How to insert text into a form with JavaScript

I'm trying to create a simple extension for personal use. It's partially from laziness, and partially from an urge to learn. I've never made extensions before, but I've been looking at the documentation. Now I just need to write the code. What I'm trying to do, is when the browser loads a certain page, to insert text into a specific form. The form is as follows

<div id="set_tags" class="advanced_option"> 
   <label for="post_tags" class="inline_input_label" id="post_tags_label"
       onclick="E开发者_运维知识库lement.remove($(this))" 
       style="left:8px; right:auto; text-align:left">tags</label> 
   <input id="post_tags" name="post[tags]" type="text"/> 
 </div> 

I haven't worked much with javascript, so is there a way to add the text "Music" to this when the page is loaded?

You can use the onload function to start your function. http://javascript.about.com/library/blonload.htm

Since you are new to javascript you may want to get familiar with unobtrusive javascript (http://www.onlinetools.org/articles/unobtrusivejavascript/chapter4.html) which I find is a better way to write javascript, as you can then easily comment out javascript and see how it works when that is disabled. But, it would be easier to learn this in the beginning.

To get the input tag you can use document.getElementById() which would be something like:

var elem = document.getElementById('post_tags');

Then, to add text to this field there should be a value property in your input definition above, and you would just do:

elem.value = "Music";

document.getElementById("post_tags_label").appendChild(
    document.createTextNode("Music"));

I'm assuming that you want to put it at the end of the element post_tags_label.

This is really easy to do if you use GreaseMonkey. It's perfect for personal changes you want to make to web pages, etc.