144 - 修炼 - 小程序的知识点13

你好呀，这周我们来聊一聊选择器。这是WXSS最后的一个小点。此外，这个点与CSS的选择器是一脉相承的。

选择器是什么呢？话说样式表对样式要做渲染，但如何确定渲染的元素呢，选择器就是样式表用来确认元素用的。比如要确定一个文本框的控件，这个控件的id是note，那么就可以使用 #note 来定位这个文本框，进而对它进行样式的渲染操作。

那么可以使用的选择器有哪些呢？我比较常用的有类选择器，Id选择器，标签选择器。使用 .notebook 选择所有拥有 class="notebook" 的组件；使用 #note 来选择所有 id="note" 的组件；使用 input 来选择所有标签为 input 的组件。

平时的开发中，使用样式选择，一般就能达到设计要求了。但实际的开发中总会遇到一些意外的情况，其中有一个比较突出——同一个元素具有多个样式渲染的时候，最终选用哪个样式进行渲染？这个就涉及到选择器的优先级的问题。

• 首先，最高层级的是 !important ，优先级为 ∞，它是用在具体的渲染的元素后面，用于最终的渲染。比如想要让 color:red 提升为最高优先级，则可以使用右侧的方式 color:red!important。
• 其次，优先其次的是行内样式style，优先级为1000， 一般多用于行内的灵活调用。行内样式，也就是我们上周聊过的内联样式，如果感兴趣的话，可以出门左转，看看上一期的文章。
• 紧接着，是Id选择器，优先级为100，这个好理解，毕竟是直接指定最小颗粒的元素的，优先级自然会高一些。
• 再其次，是类选择器，优先级为10。
• 最后，也就是标签选择器，优先级为1。也就是说，这是默认渲染的一个元素。

今天和你大概聊了下选择器，规则不是很难，但运用的时候，变化挺多的，以后遇到有趣的例子，在丰巢分享。

这里是怀英的小茶馆，有空来坐坐。