html标签通过代码隐藏和显示

---

title: html标签通过代码隐藏和显示
date: 2019-07-19 15:16:58
tags: [“html”, “JavaScript”]

工作中我们常常会碰到这个一个需求：
当用户进行操作之后，通过在页面上提示信息；

首先我们在body中定义一个提示信息的元素:

<p id="submitResult"></p>

然后在script里的用户响应中显示结果：

//获取submitResult标签并赋值
var submitResult = document.getElementById('submitResult');
submitResult.innerHTML = '判题结果：' + data.results;
//显示结果五秒后关闭
$('#submitResult').show();
$('#submitResult').delay(5000).hide(0);

至此一个小需求完成了。

当然，我们还可以作很多优化，比如先判断标签是否隐藏
$("#submitResult").is(":hidden") 返回true，则标签被隐藏了；
如果 $("#submitResult").is(":visible") 返回true，则标签已经显示了。