JS能否获取动态class的宽度并赋值给高度，目的是实现响应式正方形，附HTML和CSS

你这样的写的话 不先赋值给thumbnail统一的高度的话恐怕页面会显得参差不齐而不是你想的4块模块平均撑开页面，还有你是把写进div你当背景，那就不需要js来处理这个问题。

<style>

#thumbnailbox{position: absolute;left:0;top:0;width:100%;height:100%;}

#thumbnailbox a{width:50%;height:50%;display:block;position:absolute;left:0;top:0;}

#thumbnailbox abg1{background:url(/images/1jpg) 50% 50% no-repeat;}

#thumbnailbox abg2{left:50%;background:url(/images/2jpg) 50% 50% no-repeat;}

#thumbnailbox abg3{top:50%;background:url(/images/3jpg) 50% 50% no-repeat;}

#thumbnailbox abg4{left:50%;top:50%;background:url(/images/4jpg) 50% 50% no-repeat;}

</style>

<div id="thumbnailbox">

<a href="post_1html" title="缩略图1" class="thumbnail bg1"></a>

<a href="post_1html" title="缩略图1" class="thumbnail bg2"></a>

<a href="post_1html" title="缩略图1" class="thumbnail bg3"></a>

<a href="post_1html" title="缩略图1" class="thumbnail bg4"></a>

</div>

1、JavaScript允许你更改元素的class或id。当你更改之后，浏览器会自动更新元素的样式。

2、是className，可不是class

注意：JavaScript使用的是className去访问class属性，因为class是一个保留关键字，因为将来JavaScript可能开始支持像Java一样的类。

documentgetElementById("myDIV")className;

documentgetElementById("myDIV")classNameindexOf('firstClass')

或者

documentgetElementById("myDIV")classListcontains('firstClass');

documentgetElementById("myDIV")classListadd("firstClass");

documentgetElementById("myDIV")classListadd("firstClass", "secondClass", "thirdClass");

documentgetElementById("myDIV")classListremove("firstClass");

documentgetElementById("myDIV")classListremove("firstClass", "secondClass", "thirdClass");

以上就是关于JS能否获取动态class的宽度并赋值给高度，目的是实现响应式正方形，附HTML和CSS全部的内容，包括:JS能否获取动态class的宽度并赋值给高度，目的是实现响应式正方形，附HTML和CSS、如何用js动态设置class属性、原生JS如何查询一个元素的class，增加一个class，删除一个class等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！