Charset issue: external javascript file drops non-ASCII characters in HTML

Question

Javascript strings with non-ASCII characters work as expected successfully when placed inside a tag in the HTML file, e.g.

<script type="text/javascript">
    alert('tänään');
</script>

That is, an alert window pops up with the word 'tänään'.

However, if the code linked externally in a javascript file, e.g.

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

the 'ä' characters are replaced with null-glyph characters ('t�n��n'). Using the charset attribute does not fix it:

<script charset="UTF-8" src="js/alert.js"></script>

Why is this happening? What fixes are available?

Answer 1

While adding a charset indicator for the browser, like:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

All text based files (html, js, and oh what the heck css) should be converted to utf-8 as well.

Keep in mind to convert the files to UTF-8 without BOM to avoid those annoying empty lines that will appear on some browsers.