我想知道是否有办法加载单个 less页面加载后的某个时间。 This question有一个解释如何重新加载所有工作表的答案，但对于我的用例，现有工作表永远不会依赖于新加载的工作表，最好只是懒惰地添加工作表。我在想类似的事情
less.sheets.push(mySheet);
less.loadStyleSheet(mySheet);
可能代表一个可能的 API？干杯，
科林
2010 年 12 月 3 日更新:
我已经尝试了 Livingston Samuel 对 less.js 代码库的修复，虽然它确实有效，但它似乎无法识别已加载样式表中的定义。这是我的示例文件
一个。 index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Simple</title>
<link rel="stylesheet/less" href="/static/less/style.less" id="abc123"/>
<script src="/static/js/less-1.0.40.js"></script>
</head>
<body>
<div id="container">
<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
</div>
<div id="abc"><div>Bingo</div></div>
</body>
<script>
console.log("loading new sheet");
less.loadStyleSheet("/static/less/style2.less", function() {
console.log("Loaded!");
});
console.log("called");
</script>
</html>
无风格
@primary_color: green;
.rounded(@radius: 5px) {
-moz-border-radius: @radius;
-webkit-border-radius: @radius;
border-radius: @radius;
}
#container {
background: @primary_color;
.rounded(5px);
div {
color: red;
}
}
style2.less
#abc {
background: @primary_color;
.rounded(10px);
div {
margin: 2px;
color: blue;
}
}
所以第二个样式表确实延迟加载，但是在style2.less中有如下解析错误
“四舍五入是未定义的”
.rounded 被定义为 style.less，并且由于我还没有卸载该工作表，所以我认为它在当前环境中应该仍可用于编译器。
换句话说，我们不想重新开始，也不想卸载现有的定义，而是在已经加载的样式上构建。谢谢，
科林
最佳答案
我无法通过上面的解释来解决这个问题，所以我将提供自己的解释。
那么首先。在页面加载后加载 Less 样式表。像这样:
$('head').append('<link rel="stylesheet/less" href="path/to/yourDynamicStyles.less" />');
太棒了。现在选择您的样式表并将其推送到 Less.js 已有的表单集合中。它需要一个 DOM 对象，所以我使用了 jQuery 选择器。
less.sheets.push($('link[href="path/to/yourDynamicStyles.less"]')[0]);
如果有人知道更好的方法，请教我。 (我必须添加 [0] 才能使其正确。)如果您在控制台中执行此操作，它将返回一个数字。这个数字是较少知道的页数，因此希望它返回的数字高于您在页面加载时已经拥有的数字。
下一部分很简单。你告诉 Less.js 重新加载它所有的 lessy goodness 工作表，这包括你刚刚添加到它的堆栈中的工作表。
less.refresh();
好了。那应该只是动态加载一个样式表并告诉 Less 编译它。希望这会有所帮助。
关于javascript - less.js 延迟工作表加载，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3204317/