js 中的‘-’问题

2020 年 8 月 13 日
 aglsv

想写个点击那个 tab 时那个 tab 的下边框变橙色，但是 js 里不能写 - 符号，想问问这种情况该怎么解决


                tab[i].onclick = function(){
                    
                    tab[x].style.border-bottom = '0';
                    
                    tab[this.index].style.border = 'lightsalmon solid 4px';
                    songContent[x].style.display = 'none'
                    songContent[this.index].style.display = 'block'
                    x=this.index
                }
4102 次点击
所在节点    JavaScript
21 条回复
Jaosn
2020 年 8 月 13 日
这种功能根本不需要 JS

li :hover {
border-bottom: 1px solid xxx;
}
lisianthus
2020 年 8 月 13 日
-后面的字母大写
hoyixi
2020 年 8 月 13 日
驼峰写法，backgroundColor
borderBottomStyle，borderBottomWidth，具体可以查 MDN
shenyu1996
2020 年 8 月 13 日
border-bottom -> borderBottom
Curtion
2020 年 8 月 13 日
你把 style 对象打印出来看一看就知道都变成了小驼峰写法: borderBottom ；如果确实要用时请用['border-bottom']这种方式取属性值
lisianthus
2020 年 8 月 13 日
@lisianthus tab[x].style.borderBottom = '0';
DoUSeeMe
2020 年 8 月 13 日
> tab[x].style['border-bottom'] = '0';

拿走不谢

另 驼峰 也可
zzx0403
2020 年 8 月 13 日
获取 dom 对象里的 style 找到想要的 key
Bluevect
2020 年 8 月 14 日
楼上驼峰正解 borderBottom
aaronlam
2020 年 8 月 14 日
JS 有两种读取属性的方法，

第一种：点语法，例如：foo.bar
第二种：中括号语法，例如：foo['bar']

中括号语法，可以解决楼主你这种情况。另外针对你这种情况，还可以使用点语法属性名采用小驼峰即可。
shakaraka
2020 年 8 月 14 日
你这种需求只需要先定义好 class，然后用 classList 动态添加 class 名就能解决了的，你这把样式写 js 一堆乱
wi
2020 年 8 月 14 日
使用 TypeScript 你就会看到所有 Dom 属性的定义
PinkRabbit
2020 年 8 月 14 日
css 可解决，或者驼峰
dumbass
2020 年 8 月 14 日
动态切换 css class 更好吧
Doracis
2020 年 8 月 14 日
一般是选中加个 active 的 css class，然后定义.class{...}
azcvcza
2020 年 8 月 14 日
动态改 class 名就行了，把 css 风格和 js 硬赋值解耦，以后改就改 class 名，不用去翻 js 代码了
zhw2590582
2020 年 8 月 14 日
经验之谈，能用 css 解决的就不要用 js
aglsv
2020 年 8 月 14 日
@DoUSeeMe 多谢
aglsv
2020 年 8 月 14 日
@aaronlam 一直是加.都忘了还有中括号
aglsv
2020 年 8 月 14 日
@wunonglin 才知道有这么个方法，多谢

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://nm.100875.xyz/t/698079

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX