Gibt es eine Möglichkeit zu überprüfen, ob einige <img> Tags die gleiche src = "" haben?

-2

ich, wenn <img> oder <a> Tags haben gleiche src (id) überprüfen möchten und als klicken Sie auf einen mit gleichen src oder id Hier ist Beispielcode:Gibt es eine Möglichkeit zu überprüfen, ob einige <img> Tags die gleiche src = "" haben?

<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>

Gibt es eine Möglichkeit, es mit Jquery oder Javascript zu tun ?

i gefunden Lösung, tnx für Ihre Antworten:

javascript:(function() { 
    var ids = {}; 
    var found = false; 
    $('[id]').each(function() { 
    if (this.id && ids[this.id]) { 
     found = true; 
     console.warn('Duplicate ID #'+this.id); 
     dupid=this.id; 
     $('#'+dupid).click(); 
    } 
    ids[this.id] = 1; 
    }); 
    if (!found) console.log('No duplicate IDs found'); 
})();

Quelle

2017-02-14 ClearSky

Aber was möchten Sie tun, wenn Sie ein Duplikat gefunden haben? – NewToJS

Sie können jQuery dazu bringen, Ihnen alle img-Elemente zu geben, und dann iterieren, indem Sie ihre src-Attribute erfassen. Verwenden Sie ein Set, um die Duplikate zu erkennen. –

Warum hätten Sie zwei Elemente mit demselben 'ID'-Wert? Das ist ungültiges HTML, um nicht zu sagen unlogisch. – nnnnnn

Sie jquery verwenden können alle img Elemente zu finden:

var list = $("IMG");

Sie können dann den Selektor verfeinern nur Bilder mit einem finden SRC mit einem bestimmten Wert:

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

Und dann können Sie eine Zählung nehmen:

Wenn count> 1 dann haben Sie ein Duplikat.

Quelle

2017-02-14 01:14:35

Dies setzt jedoch voraus, dass Sie den spezifischen zu testenden "src" -Wert bereits kennen. Wie würden Sie img-Elemente mit doppeltem 'src' finden, ohne den/die Wert (e) im Voraus zu kennen? – nnnnnn

Sie können [ein Array aller SRC-Werte auf der Seite abrufen] (http://stackoverflow.com/questions/18101673/jquery-get-all-src-of-images-in-div-and-put-into- Feld) und verwende das in einer Schleife. –

Zuerst haben wir die url des Bildes, das wir überprüfen möchten, und erklären den Wähler:

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

Anzahl der img zu zählen, die gleiche URL haben:

var num = img.length;

ein klicken von ihnen (der erste):

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

Hoffe das hilft. :)

Quelle

2017-02-14 01:25:18

Die zuverlässigste Möglichkeit wäre, CSS attribute selectors zu verwenden, um alle Bilder mit der übereinstimmenden src auszuwählen, dann überprüfen Sie die length Eigenschaft der Sammlung zurückgegeben. Sie können dies entweder in jQuery tun oder document.querySelectorAll() verwenden, das auch CSS-Selektoren als Eingabe akzeptiert.

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 
}

Quelle

2017-02-14 01:27:11 ppajer

Warum verwenden Sie 'src^=' anstelle von 'src ='? Dies wird sie als Duplikate behandeln, wenn eines der Präfixe des anderen ist, z. 'src = foo' und' src = foobar'. Zugegeben, dies ist eine unwahrscheinliche Paarung, da Bild-URLs normalerweise unterschiedliche Suffixe haben und Sie kein anderes Bild haben würden, das mit einem Suffixnamen beginnt. – Barmar

Sie haben Recht. Es sollte "* =" sein, um nicht exakte URLs zuzulassen, aber jetzt, wo ich es niedergeschrieben habe, macht es keinen Sinn mehr als '^ ='. Ändern meiner Antwort, um einfach '=' zu verwenden. – ppajer

Ich habe dieses kleine Beispiel mit Hilfe dieser Seite: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_doc_images3

Hier ist die Quelle und Sie können dorthin gehen und testen. Es ist nicht die konkurrierende Antwort, aber mit ein wenig mehr Arbeit auf Ihrer Seite können Sie wahrscheinlich den Rest herausfinden. Sie erhalten die ursprünglichen Indizes im document.images-Array, die Duplikate sind. Natürlich müssen Sie nicht die ursprünglichen Arrays oder das sortierte Array ausgeben, aber ich möchte einfach sehen können, was ich mache. Die endgültigen Indizes geben Ihnen direkten Zugriff auf die Duplikate.

<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>

Quelle

2017-02-14 02:05:07 Cooper

Gibt es eine Möglichkeit zu überprüfen, ob einige <img> Tags die gleiche src = "" haben?

Antwort

Verwandte Themen