Cara menambah query di html image source

Cara menambahkan query di source image.

Di World Wide Web , Query String adalah bagian dari uniform resource locator (URL) yang berisi data yang tidak sesuai dengan struktur jalur hierarkis. Query String umumnya mencakup bidang yang ditambahkan ke URL dasar oleh browser Web atau aplikasi klien lainnya, misalnya sebagai bagian dari bentuk HTML.

Server web dapat menangani permintaan Hypertext Transfer Protocol baik dengan membaca file dari sistem file berdasarkan jalur URL atau dengan menangani permintaan menggunakan logika yang spesifik untuk jenis sumber daya. Dalam kasus di mana logika khusus dipanggil, string kueri akan tersedia untuk logika tersebut untuk digunakan dalam pemrosesannya, bersama dengan komponen jalur URL.

Nah bersangkutan dengan artikel sebelumnya: Membuat semua link dan source html http menjadi https. Kali ini saya akan share bagaimana cara menambah Query String Atau Back Query di html source image.

Berikut kode untuk menambah Query String di html image source:
Kode untuk menambah source query pada tag image html tertentu

 Class Selector /Memilih berdasarkan class name/
$(document).ready(function() {
$(‘img.class’).attr(‘src’,$(‘img.class’).attr(‘src’)+“?URL=Query%20String”);
});
 ID Selector /Memilih berdasarkan ID name/
$(document).ready(function() {
$(‘img#ID’).attr(‘src’,$(‘img#ID’).attr(‘src’)+“?URL=Query%20String”);
});
 Multiple Selector /Memilih berdasarkan class dan ID name/
$(document).ready(function() {
$(‘img.class,img#id’).attr(‘src’,$(‘img.class,img#id’).attr(‘src’)+“?URL=Query%20String”);
});

Penjelasan Untuk Kode Diatas:

img.class dan img#id merupakan sebuah selector dimana img sebagai Tag dan .class sebagai classname dan sebaliknya juga sama untuk img#id yaitu img sebagai Tag dan #id sebagai IDname. Fungsinya mengambil target target dengan nama class (classname) atau id (idname) tertentu.
attr(‘src’) merupakan objek yang akan di ambil dari selector ( img.class atau img#id ).
Intinya jQuery sama seperti pelajaran matematika aljabar. Satu di bolak balik yang satunya sebagai patokan.

Contoh implementasi menambah query di html image source

Example

Source Code:

<script>
$(document).ready(function() {
$(‘img.hello’).attr(‘src’,$(‘img.hello’).attr(‘src’)+“WPr3H7HI37MVsZIDgLNEcP4hXD1zRscDe3pNlL5vyNX1UagT1yn7hPGQyBGJPW3DJUyQMDupBl-86YFD4QM6VZksvtVhNdxmG8stcB62ATWU4ROkVLW2Ums_=w543-h271-nc”);
});

</script>
<img class=“hello” src=“https://lh3.googleusercontent.com/proxy/”/>