javascript - 用javascript编写CSS属性无法正常工作

This question already has answers here:

jQuery.css() - marginLeft vs. margin-left?

                                    （6个答案）


                                2年前关闭。


我正在尝试通过js编写一些CSS属性，并且可以通过以下代码正常工作：

$('.my-class-name').css({
  width: '100px'
});

但是，如果我添加了一个带有连字符的属性，例如“ border-right”，则它不起作用，例如：

$('.my-class-name').css({
  width: '100px',
  border-left: '10px #000000 solid'
});

最佳答案

使用'border-left'或borderLeft。如jQuery网站所述：

  通常包含连字符的CSS属性需要驼峰化
  JavaScript。例如，CSS属性font-size表示为
  fontSize在JavaScript中用作属性名称时。但是这个
  将CSS属性的名称传递给.css（）时不适用
  作为字符串的方法–在这种情况下，使用驼峰式或连字符式
  表格将起作用。

$('.my-class-name').css({
  width: '100px',
  'border-left': '10px #000000 solid'
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="my-class-name">div</div>

要么

$('.my-class-name').css({
  width: '100px',
  borderLeft: '10px #000000 solid'
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="my-class-name">div</div>

关于javascript - 用javascript编写CSS属性无法正常工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53436750/

上一篇：css - 您知道为什么搜索图标没有以白色背景颜色显示并且下拉菜单没有右对齐吗？

下一篇：css - reactjs 使内容出现在侧边栏旁边

相关文章：

javascript - 将数据传递给 onclick 事件会取消字符串的大写

html - 绝对定位的 div 在右边导致滚动条，而左边没有

javascript - 如何制作像 http ://www. brotherbots.com/上的响应式下拉菜单

javascript - DataTables 表不显示

php - Mysql数据库不适用于连字符(-)

regex - 在可选的连字符正则表达式之间捕获单词

javascript - 使用 jQuery 添加每个输入的 keyup

javascript - 使用 angularjs 登录？

javascript - Jquery 输入值未正确显示

java - 在Java输出中添加连字符