我想知道是否有一种简单的方法来改变JavaScript中的CSS类.我在这里经历了所有其他类似的问题,我找不到一个直截了当的简单解决方案.
我要做的是设置a的宽度和高度<div>以匹配我在我的网站上的图像(加载时).我已经知道图片尺寸,我可以将我的CSS设置为 - 但我希望我的脚本能够自己解决这个问题.
经过几个小时的研发(我是初学者),这就是我提出的:
var myImg = new Image();
myImg.src = "img/default.jpg";
myImg.onload = function(){
var imgWidth = this.width;
var imgHeight = this.height;
document.getElementById("myBg").setAttribute('style', "height :"+ imgHeight + "px");
document.getElementById("myBg").setAttribute('style', "width :"+ imgWidth + "px");
};
但是,这仅设置id为"myBg"的元素的宽度.如果我颠倒高度和宽度的顺序,那么它只将高度设置为图像的高度.看起来首先它将元素的高度设置为图像高度,但是在它移动到下一个语句以设置宽度之后,高度值会回到最初在css中定义的值.
我在网上进行了进一步的研究,似乎使用JavaScript更改css(插入新属性,删除等)并不是一件容易的事.它完成了
document.styleSheets[i].cssRules[i] or document.styleSheets[i].addRule
命令的类型,但所有在线和在stackoverflow上的教程都令人困惑和复杂.
我想知道是否有人熟悉document.styleSheets可以向我解释这个问题吗？
想象一下,我在单独的css文件中有这个类:
.container
{
height: 600px;
width: 500px;
}
我想在加载时将高度和宽度更改为图片的尺寸.我该怎么做呢？
谢谢.
我正在尝试为我目前正在处理的项目实施延迟加载路由。一切正常，我没有收到任何错误，当我转到新页面时，我还可以看到新的块文件加载。
但是，除了我预期的块文件之外，cli 还创建了一些带有前缀“default~pages”的额外文件，例如
default~pages-managers--managers-module~pages-hosts-hosts-module~pa~0e1f5bc0
并且default~无论我登陆哪个页面，这些带有前缀的文件都会加载。例如，如果我在主页上，我会同时看到：
pages-home-home-module
和
default~pages-managers--managers-module~pages-hosts-hosts-module~pa~0e1f5bc0
有谁知道这些默认文件是什么以及如何摆脱它们？