2016-04-13 11 views
0

vorstellen, haben wir eine Variable in JavascriptJavascript Suchen und Ersetzen src Variablen

var html = "<html>...<img src="a"></img>...<a><img src="b"></img></a></html>" 

wir nie wissen, wann img Tag befinden. Wir haben keine IDs. Sie haben nur unterschiedliche src, und wir kennen diese src, weil wir sie in einer Datenbank gespeichert haben.

Wie schreibe ich eine Methode, die jeden html Inhalt von 'html' Variable oben definiert und nur src's dort ändern. Zum Beispiel wenn ich weiß, dass src einen Wert 'a' hat, dann möchte ich eine Methode aufrufen, die dort 'c' anstelle von 'a' schreibt und so weiter. Bei einer Schleife möchte ich nur src's ändern.

Irgendwelche Gedanken?

+0

Regex zum Anpassen und Ersetzen verwenden – boomcode

+0

@boomcode NOOOOOOOOO! [Tony das Pony ... er kommt] (http://Stackoverflow.com/a/1732454/519413) –

+0

@RoryMcCrossan Parsing und ersetzen scheinen verschiedene Dinge zu sein, gibt es nichts über das Parsen von HTML-Tags in dieser Frage, es ist es, eine bekannte Teilkette durch eine andere zu ersetzen. Es hat nichts mit RegExp zu tun, und wie OP sagt, er kennt die Werte, dann kann er sie einfach ersetzen() – teran

Antwort

1

Von Ihrer Frage wissen Sie die aktuelle src.

wir diese src wissen, weil wir sie in einer Datenbank

mit curSources Speicherung aktuellen src gespeichert haben ‚s und mit neuen src‘ s in newSources Array, können Sie Schleife durch die Zeichenfolge die ersetzen src jeder img Tag

var html = '<html>...<img class="someclass" src="a"></img>...<a><img src="b"></img></a></html>'; 
 
var count = (html.match(/<img/g) || []).length; //number of img tags 
 

 
var curSources = ['a','b']; 
 
var newSources = ['c','d']; 
 

 
for (i=1; i<=count; i++) { 
 
    a = html.split('<img', i).join('<img').length; //index of i'th occurance of <img 
 
    b = html.indexOf('src',a);      //index of i'th occurance of src 
 
    c = html.substring(a,b+5);      //split from <img to src=" 
 
    html = html.replace(c+curSources[i-1]+'"',c+newSources[i-1]+'"'); 
 
} 
 

 
alert(html);

+0

danke. Wie könnte ich alle IMG-Tags ermitteln? weil Ihr Code für 'img src = ... vorbereitet ist, gibt es manchmal in meinem Code einige Attribute zwischen. Und ich möchte eine andere Methode aufrufen (mit src aufrufen) und einen anderen src zurückgeben, der in ti – kamilws

+0

@ kamilws einfügt das aktualisierte Snippet? Überprüfen Sie es – Munawir

1

Sobald Sie diese Zeichenfolge in ein jQuery-Objekt eingefügt haben, können Sie die standardmäßigen DOM-Traversalmethoden verwenden. Versuchen Sie folgendes:

var html = '<html>...<img src="a"></img>...<a><img src="b"></img></a></html>'; 
$(html).find('img[src="a"]').prop('src', 'c'); 

Dank für den Hinweis auf @Tushar, dass Sie auch mit den Anführungszeichen Sie in dem HTML-String verwenden, müssen vorsichtig sein. Wenn Sie " in der Zeichenfolge verwenden, sollten Sie ' verwenden, um es wie im obigen Beispiel zu begrenzen.

+0

Wenn html eine Zeichenfolgenvariable ist, können Sie auch die alte plain replace 'html.replace ('img src =" a "', 'img src =" something_else "');' verwenden. – Xiflado

+1

@Xiblado wahr, aber das würde brechen, wo es '' gibt. Das oben genannte ist robuster –