如何用JavaScript检测元素中是否已存在指定CSS属性？

你要检测的是元素内联style属性里的border设置（因为你的代码是直接操作element.style），可以通过以下方式实现：

核心检测逻辑 #

直接判断element.style.border是否为空字符串：

• 如果内联样式里设置过border，element.style.border会返回对应的样式值（比如"1px solid white"）
• 如果没设置过，这个值就是空字符串""

完整实现代码 #

// 获取目标元素
const myDiv = document.getElementById("myDiv");

// 判断并切换border状态
if (myDiv.style.border) {
  // 已存在内联border，移除它
  myDiv.style.removeProperty("border");
} else {
  // 不存在内联border，添加样式
  myDiv.style.border = "1px solid white";
}

补充说明 #

如果你的需求是检测最终计算后的样式（比如外部样式表、继承来的border），而不仅仅是内联样式，可以使用window.getComputedStyle()：

const myDiv = document.getElementById("myDiv");
const computedStyle = window.getComputedStyle(myDiv);

// 注意：计算后的border默认值是"none"
if (computedStyle.border !== "none") {
  myDiv.style.removeProperty("border");
} else {
  myDiv.style.border = "1px solid white";
}

不过这种情况要注意，getComputedStyle返回的是只读样式，修改还是要通过element.style操作。

内容的提问来源于stack exchange，提问作者Vikas Acharya