javascript - 将 css3 选择器翻译成 javascript

Question

我需要将一些 css 代码改编为 javascript。

我有下一个代码，我需要通过.style的 javascript 对象使其适应 javascript 对象。

使用属性，我做得很好，但是使用选择器我必须使用 javascript 操作进行开发（无论如何都要调用它）:)

.cr-container input:checked ~ .cr-bgimg div span{
    -webkit-animation: slideOut 0.6s ease-in-out;
    -moz-animation: slideOut 0.6s ease-in-out;
    -o-animation: slideOut 0.6s ease-in-out;
    -ms-animation: slideOut 0.6s ease-in-out;
    animation: slideOut 0.6s ease-in-out;
    }

Answer 1

编辑

var el = document.querySelectorAll(".cr-container input:checked");

文档：https ://developer.mozilla.org/en-US/docs/Web/API/Document.querySelectorAll

对于 jQuery：

如果认为你想要的是：

$(".cr-container input:checked")

正如你所看到的，它并没有那么不同。

或者

 $(".cr-container > input:checked")

文件：

http://api.jquery.com/checked-selector/

Answer 2

1. ~运算符用于选择 DOM 中的所有兄弟元素

2. :checked是选择单选按钮和复选框的伪类

3. 。 _ 是选择带有类的 HTML 元素

这应该工作：

$('.cr-container input:checked').siblings('.cr-bgimg div span')