使用javascript应用css :after (无jquery)

使用JavaScript应用CSS :after是通过操作DOM来实现的。在JavaScript中，可以通过获取元素的样式对象来修改元素的样式。

首先，我们需要获取要应用 :after 伪元素的元素。可以使用document.querySelector()或document.getElementById()等方法来获取元素。

然后，我们可以使用元素的style属性来修改元素的样式。对于 :after 伪元素，我们可以使用元素的content属性来设置其内容，并使用其他样式属性来设置其样式。

下面是一个示例代码：

// 获取要应用 :after 伪元素的元素
var element = document.querySelector('.my-element');

// 修改元素的样式
element.style.position = 'relative';
element.style.display = 'block';

// 创建 :after 伪元素
var afterElement = document.createElement('div');
afterElement.className = 'after-element';

// 设置 :after 伪元素的内容和样式
afterElement.style.content = '""';
afterElement.style.position = 'absolute';
afterElement.style.top = '0';
afterElement.style.right = '0';
afterElement.style.width = '100px';
afterElement.style.height = '100px';
afterElement.style.backgroundColor = 'red';

// 将 :after 伪元素添加到元素中
element.appendChild(afterElement);

在上面的示例中，我们首先获取了一个类名为 "my-element" 的元素，然后通过修改元素的样式来设置其为块级元素，并设置了一些基本样式。

接下来，我们创建了一个 div 元素，并设置其类名为 "after-element"，这个元素将作为 :after 伪元素。我们通过设置其样式来定义 :after 伪元素的样式，包括内容、位置、大小和背景颜色等。

最后，我们将 :after 伪元素添加到原始元素中，这样就完成了使用 JavaScript 应用 CSS :after 的操作。

需要注意的是，上述示例中的类名和样式仅供参考，具体的类名和样式应根据实际需求进行调整。

推荐的腾讯云相关产品：腾讯云云服务器（CVM），产品介绍链接地址：https://cloud.tencent.com/product/cvm