Question

代码如下：

<div id="compare_view" align="center">

    <div id="compv-navbar">
        <img src="image1.png"> | <img src="image2.png"> | <img src="image3.png"> | Text can be here
    </div>    
</div>

我希望能够操纵'compv-navbar'div中的所有图像。

我知道我可以给每个图像一个唯一的ID并以这种方式选择它们，但我想同时操作该compv-navbar div中的所有图像。

编辑：对不起，我想用CSS选择它。我认为标签很明显。

Answer 1

#compare_view #compv-navbar img { }

第一个id并不是必需的，但会使其更具体和线性。如果需要，您可以继续使用#compv-navbar img。

~~如果您想使用javascript进行操作，getElementById #compv-navbar和getElementsByTagName('img')将其作为上下文进行操作。~~

~~jQuery-wise它将是$('#compv-navbar img')~~

Answer 2

#compv-navbar img { 'your schnizzzle' }

Answer 3

看一下JQuery“each”方法：http://api.jquery.com/jQuery.each/

Answer 4

/*
query for id compv-navbar and populate NodeList collection with all <img> children
NOTE: since ids _required_ to be unique within the document, asking for compare_view first is redundant
*/
var nodeList = document.getElementById( 'compv-navbar' ).getElementsByTagName( 'IMG' );
for ( var i = 0; i < nodeList.length; i++ )
  nodeList[ i ].title = 'Here is my image!'

是啊，不再有JS味道了吗？

#compare_view>#compv-navbar>img { content: "here WAS my image" }

同样，选择器过于具体

如何在两个<div>标签中选择图像？</div>

4 个答案: