js给border加边框怎么操作

在JavaScript中，可以使用以下几种方式给元素添加边框：

1. 使用style属性直接设置边框样式：

element.style.border = "1px solid black";

上述代码将给元素添加一个1像素宽度、黑色实线的边框。

2. 使用classList属性添加CSS类：

element.classList.add("border-style");

在CSS中定义.border-style类：

.border-style {

border: 1px solid black;

通过添加.border-style类，元素将获得相应的边框样式。

3. 使用CSS伪类选择器：

element.classList.add("border-class");

在CSS中定义.border-class类：

.border-class::after {

content: "";

display: block;

width: 100%;

height: 1px;

background-color: black;

通过添加.border-class类，元素将在其内容后面生成一个宽度为100%、高度为1像素、背景色为黑色的伪元素，从而实现边框效果。

4. 使用CSS样式表：

var styleSheet = document.createElement("style");

styleSheet.innerHTML = ".border-class { border: 1px solid black; }";

document.head.appendChild(styleSheet);

通过创建一个style元素，并将样式表内容赋值给其innerHTML属性，然后将style元素添加到文档头部，从而实现边框效果。

以上是几种常见的给元素添加边框的方法，你可以根据具体需求选择适合的方式来操作。

千锋教育拥有多年IT培训服务经验，开设Java培训、web前端培训、大数据培训，python培训、软件测试培训等课程，采用全程面授高品质、高体验教学模式，拥有国内一体化教学管理及学员服务，想获取更多IT技术干货请关注千锋教育IT培训机构官网。