第一次体验到important在css里真的有用
之前我一直觉得CSS里的important是个鸡肋
但是今天遇到了一个场景
我觉得挺好哈
给大家看一下
我现在这个地图（Demo演示为一张地图图片）里边
有两个点是通过地址栏参数传进来的
大家看如果我只传一个start
大家看！End就不显示
然后呢再传一个End
它就显示
也就是说
这两个点是通过地址来参数控制的
而且呢
它们这个样式是直接写在行内的
大家看！display = block
然后呢比如说其中一个不传
它的display就是none了
然后遇到什么问题呢
就是这还有一个功能
就是可以切换这个大头针的功能
就是我可以控制它显示和不显示
在这种情况下
大家看！只显示一个start的情况下
隐藏没问题
但是一打开的时候
注意看这个End就跑这来了
其实原因很简单
就是我们在做切换显示的时候呢
应该做一个判断
看地址栏有没有End参数对吧
但这样的话逻辑就稍微有点复杂了
那这时候important就能用上了
大家看我们定一个样式叫强制隐藏
然后display: none !important
然后呢我们在切换的时候呢
我还写了另一个方法
在这是 ...
大家看我们在切换的时候
只是控制它有没有这样式就好了
我们再试一下
把这个打开
看一下这两个样式
好把它关掉
大家看它还是一个block 一个none
但是呢多了一个force hide
他俩都不显示了
我再把它打开也没有问题
那个End也没有显示
这样的话呢
我们就简化了代码逻辑
只要有 .force-hide
就说明要强制隐藏起来
最后更新于
这有帮助吗？