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属性用法简单介绍

相关文章
|
8月前
|
前端开发 容器
CSS语言的属性(Property)和值(Value)
CSS语言的属性(Property)和值(Value)
|
2月前
|
前端开发
css简写属性
css简写属性
37 0
|
4月前
name属性和autocomplete属性
name属性和autocomplete属性。
114 7
|
6月前
|
前端开发
CSS 实现动态显示隐藏(:checked 和 :target 的妙用)
CSS 实现动态显示隐藏(:checked 和 :target 的妙用)
46 0
|
存储 自然语言处理 搜索推荐
a标签有哪些属性
a标签作为超链接标签,具有以下常用属性: - href:用于指定链接的目标URL地址,可以是绝对或相对地址; - target:用于指定链接如何打开,常见取值有_blank(在新窗口中打开)、_self(在当前窗口打开)、_parent(在父级窗口打开)、_top(在顶层窗口打开); - rel:用于指示链接与当前文档之间的关系,常见取值有nofollow(用于搜索引擎指示不要跟踪链接)、noopener(用于防止跨窗口引用)等; - download:用于指定链接目标资源的下载,指定该属性后,浏览器会将文件下载到客户端而不是在浏览器中打开。 除了上述常用属性外,还有一些在特殊场合下使用的
2674 1
|
数据可视化 JavaScript
element-plus 树形控件用法
element-plus 树形控件是一种常用的可视化组件,可以展示树型结构的数据。以下是 element-plus 树形控件的用法。
584 0
|
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)

热门文章

最新文章