-3 
<div id="images">

                    <a href="resources/certified_training/1.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -1</a>
                    <a href="resources/certified_training/2.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -2</a>
                    <a href="resources/certified_training/3.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -3</a>
                    <a href="resources/certified_training/4.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -4</a>
                    <a href="resources/certified_training/5.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -5</a>


                </div>

我想获取此 div 中的图像数量。他们是 5，我想用 javascript 或 jquery 阅读它.. 怎么做？？？？

4

7 回答 7

1

你可以查length财产。您还可以将选择器传递给.children()

$("#images").children().length

或者

$("#images").children('a').length

或者

$("#images a").length

演示

于 2013-10-28T12:53:34.123 回答
1

这是一个仅限 Javascript 的解决方案。

alert(document.getElementsByTagName('a').length);
                    OR
console.log(document.getElementsByTagName('a').length);
于 2013-10-28T13:00:36.723 回答
1

使用.has()条件检查元素是否包含该<img>元素：

$(function() {
    var imgCount = $("#images a").has("img").length;
});

如果每个<a>可能包含多个图像，您应该使用它来代替：

$("#images a img").length

p/s：我的回答是假设 OP 打算嵌套<img>在<a>标签内，即：

<a href="resources/certified_training/2.png" rel="shadowbox[certifiedtraining];width=510;height=372"><img /></a>

如果 OP 指的是计算链接图像的数量，他可以使用：

$("a[href*='png']").length
于 2013-10-28T12:54:56.227 回答
0

要计算 jQuery 选择中的元素数量，请使用length.

$('#images a').length
于 2013-10-28T12:53:26.053 回答
0

所以，我们走吧！

//if you want to count elements use .length property

$('#images a').length

//if you want to count images by name
var images = [ ".png", ".jpg", ".gif" ] //images types
var count = 0;


for(var a=0; a < $('#images a').length; a++)
{
    for(var b=0; b < images.length; b++)
    {

        if( $($('#images a')[a]).attr('href').indexOf(images[b]) !== -1 ) //indexOf returns the position of the string in the other string. If not found, it will return -1:
        {
            count++
        } 
    } 
}

alert(count);

JSFiddle 示例

希望这有帮助！:)

于 2013-10-28T13:11:18.290 回答
0

尝试这个：

  alert($("#images a").length);

或者，

 alert($("#images").children("a").length);
于 2013-10-28T12:53:53.127 回答
0

你可以使用

$('#images a[rel^="shadowbox[certifiedtraining]"]').length // 5

这只会选择属性以 开头的<a>元素。例如，如果你有这个 HTML：rel"shadowbox[certifiedtraining]"

<div id="images">
                <a href="http://google.com">google</a><br/>
                <a href="http://stackoverflow.com">Stack Overflow</a><br/>

                <a href="resources/certified_training/1.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -1</a>
                <a href="resources/certified_training/2.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -2</a>
                <a href="resources/certified_training/3.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -3</a>
                <a href="resources/certified_training/4.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -4</a>
                <a href="resources/certified_training/5.png" rel="shadowbox[certifiedtraining];width=510;height=372">Image -5</a>


            </div>

它仍然只会返回 5，因为那里只有 5 个 shadowbox 图像。

JSFiddle

于 2013-10-28T12:54:59.097 回答