Question

这个问题可能是重复或愚蠢的。我读过与此类似的问题，但不是这个问题。

假设我有两个动态生成的li，其类别为.someclass和.someclass2，并且两者都有不同的宽度需要在页面加载时计算。

那么，有没有办法将计算出的宽度设置为一次类，而不是每次设置宽度生成新的li？ / p>

我们可以使用css执行此操作，如果已知宽度.someclass { width: 20px;} .someclass2 { width: 50px;}，那么每当新元素生成时，css都会应用于它们。

每次发生追加时都应用宽度

$('#somediv').click(somefunction); function somefunction() { $('#somediv').append('<li class="someclass"><li class="someclass2"></li></li>'); $('.someclass').css('width', $(document).width() - 112); //every time $('.someclass2').css('width', $(document).width() - 250); //every time }

应用宽度 - 有没有办法只执行一次？

$('.someclass').css('width', $(document).width() - 112); //once, but it will not work $('.someclass2').css('width', $(document).width() - 250); //once, but it will not work $('#somediv').click(somefunction); function somefunction() { $('#somediv').append('<li class="someclass"><li class="someclass2"></li></li>'); }

如果有更多元素并经常发生，会有什么性能差异会怎么样？

Answer 1

我们可以使用cssText创建JS，因此我们可以为每个css类设置自定义值。

然后创建一个style元素并将其内容设置为等于预定义 cssText

var cssText = '.someClass {width:' + (window.innerWidth - 100) + 'px;} .someClass2 {width:' + (window.innerWidth - 200) + 'px; }',
    head = document.head,
    style = document.createElement('style');

if (style.styleSheet){
    style.styleSheet.cssText = cssText;
} else {
    style.appendChild(document.createTextNode(cssText));
}

head.appendChild(style);

现在你需要做的就是：

运行上面的代码以创建所需的类
随时调用您的代码，而无需每次都添加css个样式

有没有办法用jquery更改类的属性？

1 个答案: