hinzufügen Breite Attribut in einer Zeichenfolge img

Question

i-String so etwas wie können sagen haben

x = '<div class="sample"> 
    <img src="http://www.example.com/i/java.png"> 
</div> 
<div class="sample_another"> 
    <img src="/i/somedir/python.png"> 
</div>' 

ich habe 2 Funktionen mit mir

getHeight() => liefert img Höhe und getwidth() => returns img width

Ich möchte die Breite und das Höhenattribut zu den Img-Tags hinzufügen, deren Wert ich von diesen Funktionen bekommen kann. Ich konnte keine Regex dafür finden, also dachte ich eher an einen allgemeinen Ansatz.

Das ist, was ich mit so weit

var string ="<img alt='' src='http://api.com/images/UID' /><br/>Some plain text<br/><a href='http://www.google.com'>http://www.google.com</a>"; 

var elem= document.createElement("div"); 
elem.innerHTML = string; 

var images = elem.getElementsByTagName("img"); 
for(img in images){ 
    ... 
} 

kam aber nach ich weiß nicht, wie es weitergehen, wie dies aus dom Elemente in String umgewandelt wird. und ich muss immer noch Höhe und Breite anhängen.

meine letzte Zeichenfolge sollte so etwas wie diese

x = '<div class="sample"> 
     <img src="http://www.example.com/i/java.png" height="200px" width="100px"> 
    </div> 
    <div class="sample_another"> 
     <img src="/i/somedir/python.png" width="150px" height="150px"> 
    </div>' 

sein kann mir jemand helfen, dieses Ziel zu erreichen bitte. Danke

Answer 1

Sie können die height Eigenschaft verwenden, um den Wert des Höhenattributs eines Bildes festzulegen. Und width Breite einstellen.

Verwenden Sie die for-Schleife wie unten gezeigt, wenn Sie mehrere img Tags in Ihrer Zeichenfolge haben. Wenn nicht, können Sie einfach images[0] ohne for-Schleife verwenden.

EDIT: Wenn Sie die Zeichenfolge selbst, sondern nur neu zuweisen die Zeichenfolge ändern möchten, wie unten

var string ="<img alt='' src='http://api.com/images/UID' /><br/>Some plain text<br/><a href='http://www.google.com'>http://www.google.com</a>"; 
 

 
var elem= document.createElement("div"); 
 
elem.innerHTML = string; 
 

 
var images = elem.getElementsByTagName("img"); 
 

 
for(i=0; i<images.length; i++){ 
 
    images[i].width = "150"; 
 
    images[i].height = "250"; 
 
} 
 

 
string = elem.innerHTML; // reassign the 'string' with new value 
 
console.log(string);