使用Javascript更改DIV图像样式

如何使用javascript更改

#win img

样式？我想将样式更改为：

max width:40%；最大高度：40%使用javascript或jQuery

#win img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}


document.getElementById（“win”）.style[“img”]=“最大宽度：40%；最大高度：40%；'；
您可以使用此jQuery代码使用javascript更改页面中任何元素的CSS：

$("#win img").css({
    "max-width":"40%",
    "max-height":"40%"
});


您也可以使用纯JavaScript来执行此操作，但需要为
img
标记创建一个id，代码如下所示：

document.getElementById("#myImage").style.maxWidth = "40%";
document.getElementById("#myImage").style.maxHeight = "40%";

你可以像下面这样使用

$('#win img').css({'max-width':'40%','max-height': '40%;'});

从您的代码来看，您似乎没有完全理解css选择器是如何工作的。
我能给你的最好答案是先指导你学习基础知识

但是，请注意css选择器的工作方式是：


带有#前缀的选择器引用id
有一个选择符的选择器。前缀指的是类
没有前缀的选择器引用元素

因此，您的选择器使用
id=“win”
选择某个元素中的
元素。

但是，id为“win”的div中没有任何
元素

另外，
element.style
是元素样式属性的集合，而不是样式的集合，因此调用时：

document.getElementById("win").style["img"] = 'max-width: 40%; max-height: 40%;';

它的实际含义是找到id=“win”的元素，并将其样式的“img”属性设置为
“max-width:40%；最大高度：40%；'
基本上你所做的等于：

#win{
   img:max-width: 40%; max-height: 40%;
}

这毫无意义

要选择
#win img
元素，您需要使用
querySelectorAll
，如下所示：

var myElements = document.querySelectorAll('#win img');

然后循环浏览您获得的列表并更新其样式

element.style["max-width"]= "40%";
element.style["max-height"]= "40%";

或者，由于您已将问题标记为jQuery，因此可以使用jQuery选择器一次更新所有问题：

$("#win img").css({
    max-width: ...
    max-height: ...
    width: ...
    height: ...
});

我认为如果你用类来实现这个目的会更好

请尝试以下解决方案：

<style>

.img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;    
}

.changesize { 
    max-width: 40%;
    max-height: 40%;
}

</style>

<div id="win" class="img">xyz</div>

<script>
    document.getElementById("win").className = "changesize";
</script>


.img{
最大宽度：100%；
最大高度：100%；
宽度：自动；
高度：自动；
}
.changesize{
最大宽度：40%；
最大高度：40%；
}
xyz
document.getElementById（“win”）.className=“changesize”；

希望有帮助。
您不能直接更改CSS或HTML吗？使用JS进行样式设计不是一个好主意。