gpt4 book ai didi

javascript - 更改不在 DOM 中的元素的 CSS 属性

转载 作者:行者123 更新时间:2023-11-29 17:56:45 24 4
gpt4 key购买 nike

我正在尝试使用以下命令将 css 属性添加到元素:

$(".pinned").css("left",colPositionLeft);

colPositionLeft 在页面加载时计算。

问题是加载页面时 .pinned 类不存在于 DOM 中,用户滚动后将固定类添加到元素。因此,该命令不起作用。

当页面已加载但未出现在 DOM 中时,如何设置 .pinned css 属性?

最佳答案

您可以通过 JavaScript 动态添加 CSS 规则:

document.styleSheets[0].insertRule('.pinned { left: ' + colPositionLeft + 'px; }', 0);

添加规则作为第一条规则。要将其添加为您可以使用的最后一条规则

var styleSheet = document.styleSheets[0];
styleSheet.insertRule('.pinned { left: ' + colPositionLeft + 'px; }', styleSheet.cssRules.length);

这两个示例都将规则添加到第一个样式表(包含文件或文档中的 <style> 标记),这通常应该足够了。您当然可以在 document.styleSheets 中使用其他元素将其添加到另一个。

请注意,如果您尝试使用跨源样式表执行此操作,它将抛出 SecurityError至少在某些浏览器中。

关于javascript - 更改不在 DOM 中的元素的 CSS 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38421812/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com