手动设置的style被动态生成的style覆盖问题

Question

我所需要做的表格的项目数量是不固定的，因此想动态设置表的宽度，于是给thead和tbody设置了一个style=“width:${宽度}”属性来动态控制表的宽度，因为这个表很宽，所以需要设置横滚动条，采用的是表头class设“js-target--synchronizedscroll01”，body设“js-trigger--synchronizedscroll”,data-target="01",这样滚动条拉动的时候表头会动态使用style=“margin-left:xxxpx”来实现表头也一起滚动的效果，这样的话我前面设的style就被覆盖掉了，滚动条一拉表的宽度就缩掉了。如果使用css来定义宽度的话就可以避免这种问题，但是css中取不到表头的list长度，没法动态设置宽度。这种情况有办法可以解决吗

Answer 1

你可以用js创建一个<style>样式表

var style = document.createElement('style');
style.type = 'text/css';
document.getElementsByTagName('head')[0].appendChild(style);
style.innerHTML='tbody { width: '+变量+'px !important; }';