학교 연습을 위해 Javascript를 사용하여 버튼의 너비를 늘리려 고합니다.
이것은 내 코드입니다.
const button = document.querySelector("button");
button.addEventListener("click", () => {
console.log(button.offsetWidth);
button.style.width = button.offsetWidth + 1 + "px";
});
<button>Press me!</button>
어떤 이유로 너비가 3 번 클릭하면 증가하지 않습니다. 이것은 Chromium 기반 브라우저 (Chrome, Edge, Brave)에서만 발생합니다. 이것을 더 이상하게 만드는 것은 코드가 Chrome 및 Edge의 똑같은 버전을 실행하는 다른 랩톱에서 제대로 실행된다는 것입니다. Firefox 및 IE9에서도 잘 작동합니다. 캐시 정리를 시도하고 같은 문제가있는 새 브라우저 (Vivaldi)도 설치했습니다. Windows 10 버전 1909 빌드 18363.1256을 실행하고 있습니다. Chrome의 경우 버전 87.0.4280.88, Brave, 버전 87.0.664.66 및 Edge 버전 87.0.664.66입니다.
getBoundingClientRect () 함수를 사용하면 문제가 해결됩니다.
const button = document.querySelector("button");
button.addEventListener("click", () => {
console.log(button.getBoundingClientRect().width);
button.style.width = button.getBoundingClientRect().width + 1 + "px";
});
<button>Press me!</button>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다