2.4　上机实践

2.4.1　使用hidden属性对用户评论内容进行隐藏

题目描述当我们在浏览新闻的时候，通常会发现新闻的下面有一个用户评论区域，在用户的评论区域，浏览者可以针对新闻的内容发表自己的看法，这样页面中就会存在很多用户评论的内容，这些评论内容使得页面看起来比较拥挤。这个时候我们就可以使用hidden属性来对评论的内容进行隐藏操作，效果如图2.3所示。
技术指导
首先，在页面中放置一对元素，在该元素内放置用户的评论内容，并设置该元素的id为“art”；同时在页面中放置两个单选按钮，并设置其中一个单选按钮的checked属性为“true”，即显示，另外一个单选按钮不设置checked属性，即为隐藏。然后使用JavaScript脚本将该属性取消，取消后该元素变为可见状态，同时元素中的内容也即时显示出来。其实现的主要代码如下所示。

2.4.2　使用spellcheck属性检查单词的拼写情况
题目描述
在本例中使用spellcheck属性对输入的英文语句进行检查，当所输入的英文语句中出现错误的单词时，会使用红线将错误的单词圈出，以便读者快速查找出错误的单词，运行效果如图2.4所示。
技术指导
将spellcheck属性设置成true，以此完成单词拼写的检查。其实现的主要代码如下所示。
2.4.3　对页面输出的文字进行编辑
题目描述
对页面中输出的内容进行编辑，运行结果如图2.5所示。
技术指导将article元素加上contentEditable属性后，该元素内的文字就变成可编辑的了，编辑完成后单击“保存”按钮，这时将把元素的innerHTML发送到服务器端进行保存。其实现的主要代码如下所示。