:scope

自从Gecko 55起就弃用了（Firefox 55 / Thunderbird 55 / SeaMonkey 2.52）

此功能已过时。虽然它可能在某些浏览器中仍然有效，但由于它可能在任何时候被彻底弃用，所以不鼓励使用。尽量避免使用它。

在JavaScript中，当用于Element.querySelector，Element.querySelectorAll或Element.closest时，:scope是指调用这些方法的元素。例如，document.body.querySelector(":scope")返回body元素。尽管CSS对:scope的支持已被移除，但:scope 的这种用法仍然被支持。

:scope CSS 伪类的目标是各个选择器作为参考点匹配的元素。

在HTML中，可以使用<style>元素的scoped属性定义新的参考点。如果页面上没有这样的属性，那么参考点就是<html>元素。

/* Selects a scoped element */
:scope {
  background-color: lime;
}

语法

:scope

实例

<article>
  <p>The element targeted by :scope has a lime background
    if your browser supports scoped stylesheets.</p>
  <section> 
    <p>Outside the scope.</p>
  </section>
  <section>
    <style scoped>
      :scope {
        background-color: lime;
      }
    </style>
    <p>Inside the scope!</p>
  </section>
  <section> 
    <p>Outside the scope.</p>
  </section>
</article>

结果

规范

Specification	Status	Comment
Selectors Level 4The definition of ':scope' in that specification.	Working Draft	Initial definition.

浏览器兼容性

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support (static profile - stylesheets)	No support1	(Yes)2	No support	151	7.01
In .querySelector/.querySelectorAll	27	322	No support	151	7.0

Feature	Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support (static profile - stylesheets)	No support	(Yes)2	No support	No support	7.0
In .querySelector/.querySelectorAll	27	322	No support	No support	7.0

本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com

最后更新于：2017-12-18