contenteditable属性用法简单介绍

简介:

本章节通过代码实例简单介绍一下contenteditable属性的用法。

之前,只有input和textarea的内容才是可以编辑的,但是此属性的出现,让更多元素的内容可以进行编辑。

代码实例如下:

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
<!DOCTYPE html>< html >
< head >
< meta charset = " utf-8" >
< meta name = "author" content = "http://www.softwhy.com/" />
< title >蚂蚁部落</ title >
< style type = "text/css" >
div{
   width:200px;
   height:150px;
   border:1px solid black;
}
</ style >
</ head >
< body >
< div contenteditable = "true" >蚂蚁部落欢迎您</ div >
</ body >
</ html >

上面的代码中,div是可以编辑的,非常简单。


原文发布时间为:2017-3-25

本文作者:admin

本文来自云栖社区合作伙伴“蚂蚁部落”,了解相关信息可以关注蚂蚁部落

原文链接:contenteditable属性用法简单介绍

相关文章
|
JavaScript 前端开发
使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
621 0
使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
Element Plus 日期选择器的使用和属性
Element Plus 日期选择器的使用和属性
|
10月前
|
存储 自然语言处理 搜索推荐
a标签有哪些属性
a标签作为超链接标签,具有以下常用属性: - href:用于指定链接的目标URL地址,可以是绝对或相对地址; - target:用于指定链接如何打开,常见取值有_blank(在新窗口中打开)、_self(在当前窗口打开)、_parent(在父级窗口打开)、_top(在顶层窗口打开); - rel:用于指示链接与当前文档之间的关系,常见取值有nofollow(用于搜索引擎指示不要跟踪链接)、noopener(用于防止跨窗口引用)等; - download:用于指定链接目标资源的下载,指定该属性后,浏览器会将文件下载到客户端而不是在浏览器中打开。 除了上述常用属性外,还有一些在特殊场合下使用的
1749 1
|
JavaScript 开发者
veu 中通过属性绑定为元素绑定 style 行内样式|学习笔记
快速学习 veu 中通过属性绑定为元素绑定 style 行内样式
88 0
veu 中通过属性绑定为元素绑定 style 行内样式|学习笔记
|
JavaScript
DOM对象中的常用属性(innerHTML属性,innerText属性,className属性,style属性)
DOM对象中的常用属性(innerHTML属性,innerText属性,className属性,style属性)
DOM对象中的常用属性(innerHTML属性,innerText属性,className属性,style属性)
|
Web App开发 XML 移动开发
JavaScript特性(attribute)、属性(property)和样式(style)
最近在研读一本巨著《JavaScript忍者秘籍》,里面有一篇文章提到了这3个概念。 书中的源码可以在此下载。我将源码放到了线上,如果不想下载,可以直接访问在线网址,修改页面名就能访问到相应示例代码。
JavaScript特性(attribute)、属性(property)和样式(style)