使用JS修改cssText时textDecoration:none属性不生效如何解决

cssText 接收的是符合标准CSS语法的样式字符串，你在字符串中使用了JavaScript DOM style对象专属的驼峰式属性名textDecoration，CSS本身并不识别驼峰属性名，因此这条规则会被浏览器直接忽略，只有color: #000会正常生效。

有两种常用的修复方式：

方式1：修改cssText内的属性为标准CSS写法 #

把驼峰的textDecoration改为CSS标准的短横线分隔写法text-decoration即可：

document.querySelectorAll("nav > *").forEach(function (e) {
  e.style.cssText = "text-decoration: none; color: #000";
});

方式2：直接操作style对象属性（适合少量样式修改） #

如果你习惯用驼峰写法，可以不用cssText，直接给style对象的对应属性赋值：

document.querySelectorAll("nav > *").forEach(function (e) {
  e.style.textDecoration = "none";
  e.style.color = "#000";
});

如果修改后依旧不生效，需要检查原有CSS中是否有针对导航子元素的text-decoration规则设置了!important，或者规则优先级高于行内样式，这种情况需要调整原有CSS的优先级才能让行内样式生效。

内容的提问来源于stack exchange，提问作者zayd merzougui