在javascript中更改位置或字段的顺序

Question

有没有方法可以在不访问jsp的情况下仅使用javascript或jquery更改字段的顺序。说我有我的jsp

名 姓2场

我一定能成功，如下withput触摸JSP代码？通过使用JavaScript

姓 名

Answer 1

使用示例代码

<form action="demo_form.asp"> 
First name: <input type="text" name="fname"><br> 
Last name: <input type="text" name="lname"><br> 
<input type="submit" value="Submit"> 
</form> 

如果我想改变顺序，说在显示的形式，我将使用CSS作为一个评论建议。因此，HTML可以是：

<div class="container"> 
    <form action="demo_form.asp"> 
     <div class="fname-holder"> 
      <input type="text" name="fname"> 
      <label for="fname">First name</label> 
     </div> 
     <div class="lname-holder"> 
      <input type="text" name="lname"> 
      <label for="lname">Last name</label> 
     </div> 
     <input type="submit" value="Submit"> 
    </form> 
</div> 

请注意添加的div和标签标记。 而要改变垂直顺序可以是这样使用的显示表中的CSS：

container { 
    display: table; 
} 
.fname-holder { 
    display: table-footer-group; 
} 
.lname-holder { 
    display: table-header-group; 
} 
label { 
    display: block; 
    float: left; 
} 

Here's一个的jsfiddle试试

Answer 2

也是最直接的可能是，

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> 
<script> 

    $(document).ready(function() { 
     $("form").html(' Last name: <input type="text" name="lname"><br> First name: <input type="text" name="fname"><br> <input type="submit" value="Submit"> '); 
}); 

</script>