<html>
<head>
<title>ContentEditable</title>
</head>
<body>
<!--contentEditable=true,表示是可以编辑的-->
<div contentEditable="true" style="width:500px;border:1px solid black">
广东广州
<table style="width:420px;border-collapse:collapse" border="1">
<tr><td>A</td><td>B</td></tr>
</table>
</div>
<table id="target" ondblclick="this.contentEditable=true" style="width:400px;border-collapse:collapse" border="1">
<tr><td>JavaScript</td><td>Hadoop</td></tr>
</table>
</body>
</html>
可以通过innerHTML属性来获取编辑后的内容。
还有一个就是designMode属性,它可以使整个页面上支持contentEditable属性的火元素都处于可编辑的状态,要打开designMode属性,可以用:
document.designMode='on';