使用 BEM 和现代 CSS 选择器控制级联 JavaScript

在现代的 Web 开发中，JavaScript 在应用程序的交互和动态行为方面起着重要的作用。与此同时，CSS 用于为网页提供样式和布局。当 JavaScript 和 CSS 需要进行交互时，我们可以使用 BEM（块、元素、修饰符）方法和现代 CSS 选择器来控制级联的 JavaScript 行为。本文将介绍如何使用 BEM 和现代 CSS 选择器来实现这一目标，并提供相应的源代码示例。

BEM（块、元素、修饰符）是一种流行的 CSS 类命名约定，它通过将样式和行为限定在特定的块（block）、元素（element）和修饰符（modifier）中来提高代码的可维护性。当 JavaScript 需要与这些 CSS 类进行交互时，我们可以使用现代 CSS 选择器来选择特定的元素，并通过添加或删除类来控制 JavaScript 的行为。

首先，让我们看一个简单的示例，演示如何使用 BEM 和现代 CSS 选择器控制级联的 JavaScript 行为。

HTML 代码：

<div class="block