how do I replace all the url images in blogger. example bp1.blogspot.com/image.jpg I want to change it to cdn.staticly.io/img/bp1.blogspot.com/image.jpg?format=webp using javascript or jquery
I can't change those pictures one by one ... there are many thanks
Here are some methods, assuming you MUST process your images on the client
Ugly (loads the initial image, then the other image)
window.addEventListener("load", function() {
[...document.querySelectorAll("img[src^='https://bp1.blogspot.com']")].forEach(function(img) {
let src = img.src;
img.src = "https: //cdn.staticly.io/img/"+ src + "?format=webp";
})
})
<img src="https://bp1.blogspot.com/image1.jpg" /><br/>
<img src="divider.jpg" />
<img src="https://bp1.blogspot.com/image2.jpg" /><br/>
<img src="https://bp1.blogspot.com/image3.jpg" /><br/>
Possibly nicer
Loading the content from an html file with images and replaces them before showing
$(function() {
$.get("imageSnippet.html", function(html) {
$("#container").html(html);
[...document.querySelectorAll("#container img[src^='https://bp1.blogspot.com']")]
.forEach(function(img) {
let src = img.src;
img.src = "https: //cdn.staticly.io/img/" + src + "?format=webp";
})
$("#container").show();
})
})
#container {
display: none
}
<div id="container"></div>
Using jQuery:
$('img').each(function(){
var $this = $(this);
$this.attr('src',$this.attr('src').replace(/^(http:|https:)?\/\//,'https://cdn.statically.io/img/') + "?format=webp");
})
Without jQuery:
var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
var src = imgs[i].src;
imgs[i].src = src.replace(/^(http:|https:)?\/\//,'https://cdn.statically.io/img/') + "?format=webp";
}
Put the code before the closing body tag </body>
.
I have created a ASPNet MVC site
I'm trying to verify if a XML document got modified after I loaded my page, like maybe every 30 secondsI obtain the xml by making an AJAX request, and preferably, I want to compare the new one and the previous one before calling a function that displays...
I was using Bootstrap 4 popover and suddenly got stuck with this issueThe problem is I can not select the attribute inside data-content of a popover
I have a Django form and it has inputs with the required propertyI also have a DWobject inside the form which should have a scanned image before submitting the form