含有下拉菜单的表单修改时下拉菜单根据后台显示默认值

对数据的修改经常会碰到包含下拉菜单的情况，修改表单数据时候让下拉菜单直接显示原来的数据对用户来说体验会更好，这个怎么操作呢，有一个简单方法：
首先我们创建一个隐藏的输入框，用来接收后台传过来的数据：

    <input id="test" name="test" type="hidden" th:value="${device.ip}">
    <select id="serv".....>
    <option value=" te ">选项1</option>
    <option value=" st ">选项2</option>
    </select>

html的元素内容大概如上面所示，接下来：

<script>
var test_val=$("#test").val()
$("#serv" option[value=' "+serv+" ']).attr("selected",true);
</script>

这样下拉菜单就能根据后台数据默认显示了。但是没有明白为什么下面的方法不可以：

<script>
var test_val=document.getElementById（“serv”）
$("#serv" option[value=' "+serv+" ']).attr("selected",true);
</script>

还请大神留言说明。