# 能用css办到，就不写js了吧
.button-1:active::after {
content: url(./pixel.gif?action=click&id=button1);
display: none;
}
//点击按钮即可自动上报
1
2
3
4
5
2
3
4
5
:empty 伪类用来匹配空标签元素，例如：
<div class="cs-empty"></div>
.cs-empty:empty{
display: none;
}
//如果元素为空，即隐藏，也可用在如果字段没有数据，就自动填充暂无即
dd:empty::before {
content: '暂无';
color: gray;
}
//如果列表不存在信息即填充暂无
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
除此之外，还有一类典型场景需要用到:empty伪类，那就是动态Ajax加载数据为空的情况。当一个新用户进入一个产品的时候，很多模块内容是没有的。要是在过去，我们需要在Javascript代码中做 if 判断，如果没有值，我们要吐出”没有结果“或者”没有数据“的信息。但是现在，有了:empty伪类，直接把这个工作交给CSS就可以了。例如：
.cs-search-module:empty::before{
content: '没有搜索结果'；
display: block;
line-height: 300px;
text-align: center;
color: gray;
}
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
:only-child 意思是匹配没有任何兄弟元素的元素。例如，下面的 p 元素可以匹配:only-child伪类，因为其前后没有其他兄弟元素：
###页面变灰，哀悼 在最外面的html标签上写这个样式即可
filter: grayscale(1);
1