A college and I got into a spirited discussion on how to set variables from the server side to the clients side

His solution was straight forward In Aspx page:

<script> Var sitecorevalue1 = <%=sitecorevalue1onserverside%> </script>  

And then in the javascript page just access the variable

I took a different approach

You create one div element with many data- attributes on the aspx side like

<div id=”variables” class=”hide” data-one="today" data-two=”mike” data-three=”hello” /> 

You can even wrap that div creation in an IF statement for when the variables may not need to be used or don’t exist

Then on the javascript side

var variables = $  (“#variables”);  if (variables.length) {     X= variables.data(“one”)     Y= variables.data(“two”)     Z= variables.data(“three”)  } 

The advantages I put forward are

• not polluting the name space
• not having to worried if someone else created the same variable
• not having to see if each variable exist (in our case it is all or nothing for 15 or so variables)

So am I correct in my approach?

Which approach is the best of the two or is there a third option we did not consider?