Question

我想检查<img>或<a>标记是否具有相同的src（id），而不是点击具有相同src或{{1 }} 以下是示例代码：

id

有没有办法用jquery或javascript做到这一点？

我找到了解决方案，tnx为您的答案：

<span>
    <a id="101" href="#">
        <img  src="101.png"></a>
    <a id="3" href="#">
        <img  src="3.png"></a>
    <a id="59" href="#">
        <img  src="59.png"></a>
    <a id="3" href="#">
        <img  src="3.png"></a>
</span>

Answer 1

您可以使用jquery查找所有img元素：

var list = $("IMG");

然后，您可以优化选择器以仅查找具有特定值的SRC的图像：

var list = $("IMG[SRC='image1']");

然后你可以算一下：

var count = $("IMG[SRC='image1']").length;

如果count＆gt; 1然后你有一个副本。

Answer 2

我在这个页面的帮助下做了这个小例子：http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_doc_images3

这是来源，你可以去那里测试一下。这不是竞争的答案，但只要你做一些额外的工作，你就可以弄清楚剩下的。它为您提供了document.images数组中的原始索引，这些索引是重复的。当然你不需要输出原始数组或排序数组，但我只是想看看我在做什么。最终索引使您可以直接访问重复的图像。

 <body>

  <img src="http://www.w3schools.com/jsref/klematis.jpg" alt="flower" width="150" height="113">
  <img src="http://www.w3schools.com/jsref/klematis.jpg" alt="flower" width="150" height="113">
  <img src="http://www.w3schools.com/jsref/klematis2.jpg" alt="flower" width="152" height="128">
  <img src="http://www.w3schools.com/jsref/smiley.gif" alt="Smiley face" width="42" height="42">
  <img src="http://www.w3schools.com/jsref/klematis.jpg" alt="flower" width="150" height="113">

  <p>Click the button to display the URL of the first image (index 0) in the document.</p>

  <button onclick="myFunction()">Try it</button>

  <p id="demo"></p>
  <p id="result"></p>
  <p id="answer"></p>

  <script>
    function myFunction() {
      line = '';
      var duplicates = false;
      var imageA = [];
      for (var i = 0; i < document.images.length; i++) {
        imageA[i] = [];
        document.getElementById("demo").innerHTML += '<br />' + document.images[i].src;
        imageA[i].push(document.images[i].src);
        imageA[i].push(i);
      }
      imageA.sort();
      var firsttime = true;
      for (var i = 0; i < document.images.length; i++) {
        var n = i + 1;
        document.getElementById("result").innerHTML += '<br />' + n + ' - ' + imageA[i];
        if (i > 0) {
          if (imageA[i][0] == imageA[i - 1][0]) {
            if (!firsttime) line += ', ';
            duplicates = true;
            var num = imageA[i][1];
            line += num;
            firsttime = false;
          }
        }
      }
      if (duplicates) {
        document.getElementById("answer").innerHTML = 'The follow indices of the original document.images array are duplicates: ';
        document.getElementById("answer").innerHTML += line + '.';
      }
    }
    </script>

</body>

Answer 3

首先，我们要检查图像的url，然后声明选择器：

var url = (an image url);
var img = $('img[src='+url+']');

要计算具有相同网址的img的数量：

var num = img.length;

点击其中一个（第一个）：

if (num > 1) img.first().click();

希望这会有所帮助。：）

Answer 4

最可靠的方法是使用CSS attribute selectors选择匹配src的所有图像，然后检查返回的集合的length属性。您可以在jQuery中使用document.querySelectorAll()，也可以接受CSS选择器作为输入。

function hasDuplicate(src) {
    var images = document.querySelectorAll('img[src="'+src+'"]');

    return images.length > 1;
}

// OR in jQuery

function hasDuplicate(src) {
    return $('img[src="'+src+'"]').length > 1
}

有没有办法检查某些<img/>标签是否有相同的src =＆＃34;＆＃34;？

4 个答案: