《HTML 5与CSS 3 权威指南(第4版·上册)》 —2.4 全局属性

举报
华章计算机 发表于 2019/11/23 22:18:58 2019/11/23
【摘要】 本节书摘来自华章计算机《HTML 5与CSS 3 权威指南(第4版·上册)》一书中第2章,第2.4.1节,作者是陆凌牛。

2.4 全局属性

在HTML 5中,新增了一个“全局属性”的概念。所谓全局属性,是指可以对任何元素都使用的属性,本节将详细介绍几种常用的全局属性。

2.4.1 contentEditable属性

contentEditable是由微软开发的,被其他浏览器反编译并投入应用的一个全局属性。该属性的主要功能是允许用户编辑元素中的内容,所以该元素必须是可以获得鼠标焦点的元素,而且在点击鼠标后要向用户提供一个插入符号,提示用户该元素中的内容允许编辑。contentEditable属性是一个布尔值属性,可以被指定为true或false。

除此之外,该属性还有个隐藏的inherit(继承)状态,当属性值为true时,元素被指定为允许编辑;当属性值为false时,元素被指定为不允许编辑;当未指定true或false时,则由inherit状态来决定,如果元素的父元素是可编辑的,则该元素就是可编辑的。

另外,除了contentEditable属性外,元素还具有一个isContentEditable属性,当元素可编辑时,该属性值为true;当元素不可编辑时,该属性值为false。

代码清单2-2中给出了一个使用contentEditable属性的示例,当列表元素被加上contentEditable属性后,该元素就变成可编辑的了,读者可自行在浏览器中对该示例进行试验。

代码清单2-2 contentEditable属性示例

image.png

这段代码运行后的结果如图2-2所示。

在编辑完元素中的内容后,要想保存其中内容,只能把该元素的innerHTML发送到服务器端进行保存,因为改变元素内容后该元素的innerHTML内容也会随之改变,目前还没有特别的API来保存编辑后元素中的内容。

最后,在这里列举一下支持contentEditable属性的元素:defaults、A、ABBR、ACRONYM、ADDRESS、B、BDO、BIG、BLOCKQUOTE、BODY、BUTTON、CENTER、CITE、CODE、CUSTOM、DD、DEL、DFN、DIR、DIV、DL、DT、EM、FIELDSET、FONT、FORM、hn、I、INPUT type=button、 INPUT type=password、INPUT type=radio、INPUT type=reset、INPUT type=submit、INPUT type=text、INS、ISINDEX、KBD、LABEL。

 image.png

图2-2 可编辑列表示例


【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。