Javascript 根据浏览器用户代理更改样式

我觉得我真的很接近于这一点，但它似乎不起作用。 谁能帮帮我吗

var userAgent=navigator.userAgent.toLowerCase（）；
if（userAgent.indexOf（'OPR'）！=-1）{
if（userAgent.indexOf（'Chrome'）>-1）{
//浏览器是chrome
$（“#evs”）.addClass（“.chrome”）；
}否则{
//浏览器是opera，添加css
$（“#evs”）.addClass（“.opera”）；
}
}

• 首先使用

  .toLowercase（）

  ，但要尝试匹配大写字符：

  'OPR'

  ，

  'Chrome'

• jQuery的.addClass（）需要一个类名字符串（不带点），如：

  $（“#evs”）.addClass（“chrome”）-JS的classList.add（）方法也是如此：

以下是我的建议：

const UA=navigator.userAgent；
const EL#u evs=document.querySelector（“evs”）；
如果（/Chrome\//i.test（UA））{//不区分大小写（i），如果需要？
if（/OPR\/.test（UA））{//区分大小写
EL_evs.classList.add（“UA opera”）；
}否则如果（/Edg\/.test（UA））{//区分大小写
EL_evs.classList.add（“UA边缘”）；
}否则{
EL_evs.classList.add（“UA chrome”）；
}
}

.uachrome{背景：金色；}
.UA边缘{背景：蓝色；}
.UA opera{背景：红色；}

---

TEST

抱歉，我更改了位，它应该是。toLowerCaseOkay我将尝试更好地解释我尝试执行的操作：此代码尝试通过is ID选择对象，并根据正在查看的浏览器向is添加一个类。OPR是Opera浏览器的代理，而#evs是我试图移动的图像的ID。是的，但我不能通过名称或用户代理选择浏览器吗？它仍然作为Opera版本出现，所以我仍然存在的问题是，当我添加此代码时，所讨论的图像现在没有显示在Opera或Chrome中。我不明白为什么…看起来这个类没有被添加到图像中，使用这个代码<代码>