Javascript best practices - Using server-side values

Question

For the past few years I have always used a client-side hidden <input> field to store a server-side value and use it in Javascript land.

For example, let's say I need an Ajax timeout value from my app configuration.

I'd probably store it like this in my JSP:

<input type="hidden" id="ajaxTimeout" value="${serverValue}" />

and then use it like this where my AJAX call lived in an external file:

$("#ajaxTimeout").val()

I was having a discussion about this today and it was suggested that it is best practice to store values which are only going to be used by Javascript within HTML <meta> tags.
Does this matter? Is there a preferred way to obtain server-side information which is solely to be used in Javascript?
My understanding is that if the hidden input field is not part of a form then it is safe enough to use to store value as it won't be attached to any requests. Having said that, I've always thought this was indeed a bit of a hack.

Thoughts?

::EDIT::
Two fantastic answers:

• Use objects literals for general in-page data that is not tied to any particular DOM element.
• Use data attributes to store custom data tied to DOM elements: http://www.w3.org/TR/2010/WD-html5-20101019/elements.html#attr-data

Answer 1

We personally do something like this:

var options = {
    selector: '#divId',
    serverSideVariableHere: <%=AspNetProperty %>,
    anotherServerSideVariableHere: <%=AspNetPropertyTwo %>
}
var viewModel = new KnockoutViewModel(options);
ko.applyBindings(viewModel, $(options.selector)[0]);

This is simply an example using KnockOut JS, but this idea can be expanded to any JavaScript library you choose to use (or not ;))

We then pass these options to whatever use them, such as Knockout ViewModels, or whatever. That way our JavaScript remains testable and we can pass in whatever values we want to our tests.