* URL 변경 후 새로고침 하면
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
document.addEventListener('DOMContentLoaded', function () {
// "b" 파라미터 변경 버튼
document.getElementById('changeParamBtn').addEventListener('click', function () {
updateURLParam('b', 1);
});
// URL 파일명 변경 버튼
document.getElementById('changeFileBtn').addEventListener('click', function () {
updateURLFile('abc.html');
});
});
// "b" 파라미터 변경 함수
function updateURLParam(param, value) {
let url = new URL(window.location.href);
let params = url.searchParams;
if (params.has(param)) {
let currentValue = parseInt(params.get(param), 10);
params.set(param, currentValue + 1);
} else {
params.set(param, value);
}
let newUrl = url.pathname + '?' + params.toString();
window.history.pushState({}, '', newUrl);
}
// 파일명을 변경하는 함수
function updateURLFile(newFileName) {
let url = new URL(window.location.href);
let pathParts = url.pathname.split('/');
// 마지막 요소(파일명)를 새로운 파일명으로 변경
pathParts[pathParts.length - 1] = newFileName;
let newPath = pathParts.join('/');
let newUrl = newPath + url.search; // 기존 쿼리 파라미터 유지
window.history.pushState({}, '', newUrl);
}
</script>
<button id="changeParamBtn">b 값 변경</button>
<button id="changeFileBtn">파일명을 abc.html로 변경</button>
</body>
</html>
다른 형식도 충분히 가능 함
'[ Web 관련 ] > 자바스크립트' 카테고리의 다른 글
| 새로고침 하면서 특정 파라미터 수정 하기 (0) | 2024.07.02 |
|---|---|
| 브라우저의 주소창 URL 바꾸기 (0) | 2024.02.22 |
| 자바스크립트에서 \n 개행이 안되고 문자 그대로 출력되는 경우 (0) | 2022.09.28 |
| 크롬에서 마우스 좌표 조회 (개발자 모드) (0) | 2022.02.10 |
| 자바스크립트 전체 콤마 제거 (0) | 2021.10.22 |
