使用jQuery设置tooltip元素样式未生效，请求原因解析

API 探路者

2026-5-27

问题原因及解决方案

嘿，我来帮你排查这个样式不生效的问题！

核心问题出在你写的jQuery .css() 方法里的属性名语法错误：JavaScript不允许直接使用带连字符（比如text-align、font-size）的名称作为对象的属性键，因为连字符会被解析成减法运算符，直接导致代码报错，样式自然不会生效。

你可以通过两种方式修正这个问题：

方法一：使用驼峰式属性名（jQuery推荐写法）

把带连字符的CSS属性转换成驼峰式命名（去掉连字符，连字符后的第一个字母大写），比如text-align → textAlign，font-size → fontSize：

$('.tooltip').css({ 
  background:'#96c11f', 
  padding:'20px', 
  width:'100%', 
  display:'block', 
  textAlign:'center', 
  color:'white', 
  fontSize:'1.4em', 
  marginBottom:'40px' 
});

方法二：给带连字符的属性名加引号

如果想保留CSS原生的带连字符属性名，只需要给这些属性名加上单引号或双引号，让JavaScript把它们当作字符串属性键：

$('.tooltip').css({ 
  background:'#96c11f', 
  padding:'20px', 
  width:'100%', 
  display:'block', 
  'text-align':'center', 
  color:'white', 
  'font-size':'1.4em', 
  'margin-bottom':'40px' 
});