Erro em função javascript!

[MHK 0]

Olá amigos, estou com um problema em uma página html que estou produzindo.

 

Tenho dois arquivos css e desejo permitir que o usuário selecione qual deles quer que a página exiba. Para isso criei um campo select cujos subcampos option tem como valor o nome dos arquivos CSS.

 

Em um arquivo javascript criei a seguinte função:

 

function mudar_tema(){
	//alert('cheguei aqui!');
	if (document.getElementbyId('tema').value == 'main.css')
	{
		alert('entrei aqui!');
		document.getElementById('sec_css').href='';
		document.getElementById('main_css').href='main.css';
		alert(document.getElementById('main_css').href);
	}
	if (document.getElementbyId('tema').value == 'sec.css')
	{
		document.getElementById('main_css').href='';
		document.getElementById('sec_css').href='sec.css';
		alert(document.getElementById('sec_css').href);
	}
}

Pelo que pude perceber usando a função alert ele sequer verifica a condição quando eu seleciono alguma opção no select, que está assim escrito:

 

<select id="tema" name="tema" onchange="mudar_tema();"><option value="main.css">Principal</option><option value="sec.css">Secundário</option></select>

Alguém pode me explicar o porquê do erro?

 

P.s: isso se repete em todos os navegadores que testei (IE8, Opera10, Firefox3.5 e Google Chrome)!

[Thiago Retondar 18]

Cara, não entendi muito bem sua dúvida... É isso aqui que deseja:

 

JavaScript

function mudar_tema(){
	var tema = document.getElementById("tema");
	if(tema.value == "tema1"){
		alert("Tema 1");
		//Substitua o CSS se for o Tema 1
	} else{
		alert("Tema 2");
		//Substitua o CSS se for o Tema 2
	}
}

HTML

<select id="tema">
	<option value="tema1">Tema 1</option>
	<option value="tema2">Tema 2</option>
</select>
<input type="button" onclick="mudar_tema()" value="Trocar de tema" />

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif