1.contentEditable属性

HTML5给大部分的元素增加了contentEditable属性，如果将该属性设为true，就会允许我们直接编辑元素的内容。比如文本框、文本域之类，可以变成可编辑状态。contentEditable属性具有Java可继承的特点：如果父元素是可编辑的，那么子元素也是可编辑的，除非指定contentEditable=false。下面示范div元素和table元素转换成可编辑状态。

	
   	
   	 contentEditable属性 
   
   
    Java
    
    
           	       IOS 	       Android       
      	       轻量级Java EE 	       经典Java EE       
     
    
   
   
   
   
         	      HTML 5 	      Ruby      
     	      C/C++ 	      Python

除此之外，contentEditable属性的元素还提供了isContentEditable属性，当元素处于可编辑状态时，返回值为true，否则反之。当我们编辑完成之后，编辑的内容会直接显示在页面上。注意：当编辑内容时，不要刷新页面，一旦刷新页面就会重新加载，编辑的内容会丢失，我们可以通过元素的innerHTML属性来获取编辑后的值。

2.designMode属性

designMode属性相当于一个全局的contentEditable属性，如果将designMode的值设置为on，页面上所有的元素都会变成可编辑状态，示例如下：当鼠标双击时，所有元素都会进入了可编辑状态。

	
   	
   	 designMode属性 
   
    aaaa
   
   
         	      Java 	      Android      
     	      轻量级Java EE 	      经典Java EE

3.hidden属性

HTML5的所有元素都有hidden属性，为true时显示，为false时隐藏。CSS中的display属性也可以设置，display：none。下面就示范了hidden属性的功能。当我们点击页面按钮时，div元素会在显示和隐藏之间切换。

	
   	
   	 hidden属性 
   
    文字内容

4.spellcheck属性

我们可以在input元素和textarea元素增加spellcheck属性，当属性为true时，就会对输入的文本内容执行检查，如果不通过就会对有错误的单词进行提示。当我们输入有误的话，会出现红色波浪线的提示。

	
   	
   	 spellcheck属性

5.contextmenu属性

contextmenu属性用于设置上下文菜单，当我们单击鼠标右键时，将会触发菜单。不过到目前为止，还没有浏览器支持该属性。

--------------如果大家喜欢我的博客，可以点击左上角的关注哦。

转载地址：http://wypti.baihongyu.com/

你可能感兴趣的文章