Hàm encodeURI () mã hóa URI hoàn chỉnh bao gồm các ký tự đặc biệt ngoại trừ các ký tự ngoại trừ (, /?:@ &=+ $ #).
Hàm encodeURIComponent () mã hóa một số phần của URI bằng cách mã hóa cơ bản các ký tự đặc biệt. Nó cũng mã hóa các ký tự sau - (, /?:@ &=+ $ #)
Hàm decodeURI () giải mã URI được tạo bởi hàm encodeURI ().
Hàm decodeURIComponent () được sử dụng để giải mã một số phần của URI được tạo bởi encodeURIComponent ().
Sau đây là mã cho encodeURI (), decodeURI () và các hàm thành phần của nó -
Ví dụ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.encode,
.decode {
font-size: 18px;
font-weight: 500;
}
</style>
</head>
<body>
<h1>encodeURI(), decodeURI() and its components functions</h1>
<button class="encodeUri">ENCODE URI</button>
<button class="decodeUri">DECODE URI</button>
<button class="encodeUriComponent">ENCODE URI COMPONENT</button>
<button class="decodeUriComponent">DECODE URI COMPONENT</button>
<div class="encode"></div>
<div class="decode"></div>
<h3>
Click on the above buttons to encode or decode URI component
</h3>
<script>
let fillEle = document.querySelector(".sample");
let decodeEle = document.querySelector(".decode");
let encodeEle = document.querySelector(".encode");
let url = "https://www.google.com/sample%20link/?img=91gf.jpg&size=451px";
let encodeUrl;
document.querySelector(".encodeUri").addEventListener("click", () => {
encodeUrl = encodeURI(url);
encodeEle.innerHTML = "Encoded url = " + encodeUrl;
});
document.querySelector(".decodeUri").addEventListener("click", () => {
decodeEle.innerHTML = "Decoded url = " + decodeURI(encodeUrl);
});
let encodeComponent;
document
.querySelector(".encodeUriComponent")
.addEventListener("click", () => {
encodeComponent = encodeURIComponent(url);
encodeEle.innerHTML = "Encoded url = " + encodeComponent;
});
document
.querySelector(".decodeUriComponent")
.addEventListener("click", () => {
decodeEle.innerHTML =
"Decoded url = " + decodeURIComponent(encodeComponent);
});
</script>
</body>
</html> Đầu ra
Khi nhấp vào nút “ENCODE URI” và sau đó nhấp vào nút “DECODE URI” -
