实例
一段可编辑的段落:
这是一个可编辑的段落。
浏览器支持
IE
Firefox
Chrome
Safari
立即学习“前端免费学习笔记(深入)”;
Opera
所有主流浏览器都支持 contenteditable 属性。
定义和用法
contenteditable 属性规定元素内容是否可编辑。
注释:如果元素未设置 contenteditable 属性,那么元素会从其父元素继承该属性。
HTML 4.01 与 HTML5 之间的差异
contenteditable 属性是 HTML5 中的新属性。
语法
属性值
| 值 | 描述 |
| true | 规定元素可编辑。 |
| false | 规定元素不可编辑。 |
在HTML里面,光标是一个对象,光标对象是只有当你选中某个元素的时候才会出现的。
当我们去点击一个输入框的时候,实际上它会产生一个选中对象-selection(就是我们可以看到的文字变成蓝色的那个区域),selection在火狐浏览器可以直接用 window.getSelection()获取,在HTML里面,selection只有一个的,并且selection是一个区域,你可以想象成一个长方形,它是有开始和结束的
当你点击一个输入框,或者你切换到别的输入框,selection是会跟着变化的。光标就是在selection里面,光标叫做range,是一个片段区域,和selection一样,有开始点,和结束点,当我们对文字按下左键向右拉的时候,就看到了文字变成蓝色,那个就是光标的开始和结束,当我们直接点一下的时候,光标在闪,其实只是开始和结束点重叠了。
OK,现在我们来实际操作光标了。直接看完整的代码,然后看效果吧。











