Recentemente resolvi que precisava de uma página web onde eu pudesse comutar entre duas línguas na mesma página sem ter de recarregar a página. Coloquei cada língua em um div sendo um deles invisível e usei um javascript para comutar entre uma língua e outra. O desenho básico desta página seria o seguinte:
<html> <script type="text/javascript"> function set_lang(lang) { var oPort = document.getElementById('pt'); var oEng = document.getElementById('en'); var sDisplay = 'display:block'; var sNoDisplay = 'display:none'; if (lang=='en') { oPort.setAttribute("style", sNoDisplay); oEng.setAttribute("style", sDisplay); } if (lang=='pt') { oPort.setAttribute("style", sDisplay); oEng.setAttribute("style", sNoDisplay); } } </script> <body> <div style="text-align:center"> <a href="javascript:set_lang('en')">English</a> <a href="javascript:set_lang('pt')">Português</a> </div> <div id="pt" > Texto em português. </div> <div id="en" style="display:none"> Text in english. </div> </body> </html>
Depois de alguns dias percebi que isso não funcionava em nenhuma versão do Microsoft Internet Explorer. Depois de alguns testes e alguma pesquisa descobri que o setAttribute do IE não funciona em estilos e classes [Nye2005]. Isso realmente me surpreendeu, eu achava que a época onde erros tolos como esse, que prejudicassem o funcionamento entre browsers tivesse passado há muito tempo. Muito contrariado mudei meu javascript para:
function set_lang(lang) { var oPort = document.getElementById('pt'); var oEng = document.getElementById('en'); var sDisplay = 'display:block'; var sNoDisplay = 'display:none'; if (lang=='en') { oPort.style.cssText = sNoDisplay; oEng.style.cssText = sDisplay; } if (lang=='pt') { oPort.style.cssText = sDisplay; oEng.style.cssText = sNoDisplay; } }
E agora ele funciona no Firefox, Chrome, e IE. A princípio eu achei isso uma imensa falha do Microsoft Internet Explorer, mas resolvi pesquisar um pouco mais, e em vários lugares encontrei justificativas para isso, de fato não se trata de um erro, mas do fato de que a Microsoft insiste em ser diferente, basta ver as definições do W3C e uma lista de características compatíveis para cada browser, e você verá que o IE na maioria das vezes é o único diferente, mesmo em coisas que até o Konqueror e o Opera suportam [Koch2008], de quem é a culpa então?
Referências
[Nye2005]: NYE, Dan. Bug Report: setAttribute does not work when used with the style attribute. Disponível em: <http://www.quirksmode.org/bugreports/archives/2005/03/setAttribute_does_not_work_in_IE_when_used_with_th.html>. Acesso em: 13 jan. 2009.
[Koch2008]: KOCH, Peter-Paul. W3C DOM Compatibility - CSS. Disponível em: <http://www.quirksmode.org/dom/w3c_css.html>. Acesso em: 13 jan. 2009.
[Goodman2002]: GOODMAN, Danny. Dynamic HTML: The Definitive Reference. 2nd ed. Sebastopol, CA: O’Reilly, 2002.
Recent Comments