需要编辑的地方搞成一个div，点击修改按钮时改变div的可编辑状态并改变一下样式使其像文本框，div可编辑属性<div contentEditable=true></div>
搞个隐藏的文本框，点击修改按钮时，显示出来并把值赋进去
<input type="text" style="display:none">
或者点击修改按钮时创建一个文本框出来
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
在1995年时，由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。 [1]
为了取得技术优势，微软推出了JScript，CEnvi推出ScriptEase，与JavaScript同样可在浏览器上运行。为了统一规格，因为JavaScript兼容于ECMA标准，因此也称为ECMAScript。
首先将文本框隐藏掉
js通过触发事件来显示文本框
我们动手实现一个小例子
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>js控制元素的显示与隐藏</title>
<style type="text/css">
*{
margin:0
padding:0
}
</style>
</head>
<body>
<input type="button" id="btn1"value="显示">
<input type="button" id="btn2" value="隐藏">
<input type ="text" id="textArea"style="display:none">
<script>
'use strict'
var text = document.getElementById("textArea")
var oBtn1 = document.getElementById("btn1")
var oBtn2 = document.getElementById("btn2")
oBtn1.onclick = function(){
text.style.display = "block"
}
oBtn2.onclick = function(){
text.style.display = "none"
}
</script>
</body>
</html>
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<form>
<table class="table table-striped">
<caption>用户注册</caption>
<tbody>
<tr class="title">
<td colspan="2">登录信息填写：以下请填写登录信息</td>
</tr>
<tr>
<td id="a2" class="title">用 户 名<br /><span>长度限制8个字符或汉字</span></td>
<td id="b2"><input type="text" name="username" id="uname"> <span>（必填项目）（建议使用真实姓名注册）</span></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2"><input type="submit" value=" 提 交 " onClick="submit()"><input type="submit" value=" 重 置 "></td>
</tr>
</tfoot>
</table>
</form>
<script type="text/javascript">
/**
* 获取地址栏参数
* @param key 参数名
*/
var getParam = function (key) {
var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)")
var r = window.location.search.substring(1).match(reg)
return r ? decodeURI(r[2]) : null
}
var username = getParam('username')
if (username) {
document.getElementById("b2").innerHTML = username
}
</script>
</body>
</html>
