根据浏览器更改类中的元素答案

【问题标题】：Change an element in a class dependant on browser根据浏览器更改类中的元素
【发布时间】：2013-06-07 18:28:30
【问题描述】：

我想要的是检测用户是否在使用 chrome，然后将该类的 margin-bottom 更改为不同的东西？

这是 div：

<div id="titleAreaBox" class="ms-noList ms-table">

这就是我正在使用的课程：

#titleAreaBox{
    margin-left:0px;
    height:0px; 
    margin-bottom:-31px;    
}

所以我希望能够更改此类的 margin-bottom:-31px 元素，如果浏览器是 chrome....这在 javascript 中可能吗？

【问题讨论】：

jQuery 可以接受吗？
是的，我也可以使用 jquery
只想在 Chrome 上更改边距的原因是什么？特定于浏览器的检测通常不受欢迎。
@CallumHolden 我认为 ajp15243 想说的是，如果它不能在所有浏览器中工作，那么你的 CSS 可能有问题，除非你试图做一些非常复杂的事情。跨度>
@crush 是的，差不多 :)。如果导航栏在 Chrome 中看起来不正确，那么标记/CSS 可能会做得更好。您应该使用标记和 CSS（可能还有 jsfiddle 或等效项）打开一个问题，询问为什么它在 Chrome 中看起来与您测试过的其他浏览器不同（指定哪些浏览器！）。跨度>

标签： javascript html css

【解决方案1】：

var isChrome = navigator.userAgent.toLowerCase().indexOf('chrome') >= 0;
if(isChrome) document.getElementById('titleAreaBox').style.marginBottom = '-31px';

未经测试，但应该可以。

【讨论】：

没有反对，但是，我可以想象一个声称“基于 chrome”的浏览器。并不是说以前从未发生过。
检测部分正在工作......但它只是没有改变元素的样式
是的，它正在工作，但对您来说似乎不是，因为您的班级已经将边距底部设置为 -31px。请参阅this fiddle 并尝试使用if(isChrome) ... 评论/取消评论该行，您会发现它有效！

【解决方案2】：

我会调查一下 http://www.quirksmode.org/js/detect.html

一段很长的代码，但是好像覆盖了所有浏览器，复制粘贴就行了。

【讨论】：