Option 1 is the correct way to do but just change the variable name to something different as it is JavaScript keyword

<script type="text/javascript">
 var _value= document.getElementById(<%= txtUserName.ClientID %>).value;
 alert(value);
</script>

But I prefer to use jQuery which make life much easier. For that add jQuery file in your aspx or masterpage. Then use below line

<script type="text/javascript">
 var _value= $(<%= txtUserName.ClientID %>).val();
 alert(value);
</script>

Option 1 is the correct way to do but just change the variable name to something different as it is JavaScript keyword

<script type="text/javascript">
 var _value= document.getElementById(<%= txtUserName.ClientID %>).value;
 alert(value);
</script>

But I prefer to use jQuery which make life much easier. For that add jQuery file in your aspx or masterpage. Then use below line

<script type="text/javascript">
 $(document).ready(function(){     
   var _value= $(<%= txtUserName.ClientID %>).val();
   alert(value);
 });
</script>