如何在一行javascript代码中做多个css类

How to do mutiple css class in one line javascript code

本文关键字:代码 css javascript 一行      更新时间:2023-09-26

我有css类名- .exp-1, .exp-2, .exp-3, exp-4…有没有什么简单的方法可以把这些都写在网上比如,我是javascript初学者

document.getElementsByClassName("exp-1")[0];
document.getElementsByClassName("exp-2")[0];
document.getElementsByClassName("exp-3")[0];
document.getElementsByClassName("exp-4")[0];

 document.getElementsByClassName("exp-1,exp-2,exp-3, exp-4")[0];

你可以先使用querySelector,然后再使用类似css的选择器。它返回所有选定元素中的第一个元素。如果你想返回所有你可以使用querySelectorAll

 document.querySelector(".exp-1,.exp-2,.exp-3,.exp-4");

您可以使用starts with选择器

document.querySelectorAll('[class^=exp-]')

示例

Array.from(document.querySelectorAll('[class^=t]'), function(el) {
  console.log(el.innerHTML)
})
<div class="t1">1</div>
<div class="t2">2</div>
<div class="t3">3</div>
<div class="t4">4</div>