相关疑难解决方法(0)

CSS类选择器中允许使用哪些字符/符号？我知道以下字符无效,但哪些字符有效？

~ ! @ $ % ^ & * ( ) + = , . / ' ; : " ? > < [ ] \ { } | ` #

做getElementsByClassName(等类似的功能getElementsByTagName和querySelectorAll)的工作方式相同getElementById,还是他们返回元素的数组？

我问的原因是因为我试图改变所有元素的样式getElementsByClassName.见下文.

//doesn't work
document.getElementsByClassName('myElement').style.size = '100px';

//works
document.getElementById('myIdElement').style.size = '100px';

我无法弄清楚如何在JavaScript中使用多个ID.单个ID和getElementById没问题,但是只要我将ID更改为类并尝试使用getElementsByClassName,该函数就会停止工作.我读过有关该主题的100篇帖子; 仍然没有找到答案,所以我希望有人知道如何使getElementsByClassName工作.

以下是我用于测试的一些简单代码:

function change(){
    document.getElementById('box_one').style.backgroundColor = "blue";
}

function change_boxes(){
    document.getElementsByClassName ('boxes').style.backgroundColor = "green";
}


<input name="" type="button" onClick="change(document.getElementById('box_one')); change_boxes(document.getElementsByClassName('boxes'))" value="Click" />   

<div id="box_one"></div>
<div class="boxes" ></div>
<div class="boxes" ></div>

我写了一个脚本,它的目标是停止显示图像一和二,同时允许图像3保持显示并移动到它们的位置.当我使用div Id而不是div Classes时,它工作正常,但我更喜欢使用div类,所以我可以像这样对元素进行分组:

 function myFunction() {
     var y = document.getElementsByClassName("firstimage secondimage");
     if (y.style.display === 'none') {
           y.style.display = 'block';
     } else {
           y.style.display = 'none';
     }
 }

而不是这个(为了节省空间,我应该选择包含更多元素):

 function myFunction() {
     var x = document.getElementById("firstimage");
     if (x.style.display === 'none') {
          x.style.display = 'block';
     } else {
          x.style.display = 'none';
     }

     var y = document.getElementById("secondimage");
     if (y.style.display === 'none') {
          y.style.display = 'block';
     } else {
          y.style.display = 'none';
     }
}

我认为只是将div id改为div类,#imagenumber改为.imagenumber(除了我上面描述的javascript的改变之外)会有效,但是当我这样做时脚本停止工作.我需要脚本以与我在下面粘贴的代码相同的方式运行,但是使用div类而不是div Id.请告诉我哪里出错了.

CSS:

#firstimage {
    width: 100px;
    height: 100px; …