JavaScript는 !important 스타일을 동적으로 추가하고, 스타일이 가장 높은 우선순위를 가지며, 마우스 커서를 숨기고, 커서가 페이지에 나타나는 것을 금지합니다. setProperty, cssText, setAttribute


잘못된 철자법

이 표현은 작동하지 않습니다.

document .body.style.cursor = 'none !important';

효과적인 글쓰기 (1)

document.body.style.setProperty('cursor', 'none', 'important');

이는 커서 속성의 값을 없음으로 설정하고 !important 플래그를 추가하여 우선 순위가 가장 높고 다른 스타일로 재정의될 수 없도록 합니다. 이는 웹 페이지에서 마우스 커서를 숨기는 데 유용합니다.


효과적인 글쓰기 (2)

document.body.style.cssText = 'cursor: none !important;';

그러면 스타일 속성을 통해 요소에 스타일 규칙이 추가되고 커서 속성이 없음으로 설정되며 !important로 표시됩니다.


!important를 사용하면 동일한 속성에 적용될 수 있는 다른 스타일 규칙이 재정의되어 스타일이 의도한 대로 영향을 받지 않을 수 있으므로 주의해서 사용해야 합니다. !important 사용을 강제해야 하는 경우에만 사용해야 합니다. 가장 좋은 방법은 스타일에서 !important를 자주 사용하지 않는 것입니다.


효과적인 글쓰기 (3)

document.body.setAttribute("style", "cursor: none !important;");

그러면 지정된 요소의 스타일 속성이 설정되고 커서 속성은 없음!중요로 설정됩니다. 이는 요소의 기존 스타일을 재정의하므로 다른 스타일 규칙에 영향을 주지 않는지 확인하세요.


setAttribute

w3school

setAttribute() 메소드는 지정된 속성을 추가하고 지정된 값을 할당합니다.
지정된 속성이 이미 존재하는 경우에만 값을 설정/변경합니다.
참고: HTML 문서의 HTMLElement 객체는 모든 표준 HTML 속성에 해당하는 JavaScript 속성도 정의합니다. 따라서 비표준 속성을 설정해야 하는 경우에만 이 방법을 사용하십시오.


MDN

지정된 요소에 속성 값을 설정합니다. 속성이 이미 있으면 값을 업데이트하고, 그렇지 않으면 지정된 이름과 값을 가진 새 속성을 추가합니다.
속성의 현재 값을 얻으려면 getAttribute() 를 사용하고 , 속성을 제거하려면 RemoveAttribute() 를 사용하세요 .


CSS텍스트

w3school

cssText 속성은 요소의 인라인(inline) 스타일 선언 값을 설정하거나 반환합니다.


MDN

cssText는 스타일 규칙에 포함된 실제 텍스트를 반환합니다. 스타일 시트 규칙을 동적으로 설정하려면 동적 스타일 정보 사용을 참조하십시오 .


setProperty

W3학교

setProperty() 메서드는 CSS 선언 블록 내에서 새 CSS 속성을 설정하거나 기존 속성을 수정합니다.


MDN

CSSStyleDeclaration.setProperty() 메소드 인터페이스는 CSS 스타일을 선언하는 객체에 대한 새 값을 설정합니다.

Supongo que te gusta

Origin blog.csdn.net/weixin_51157081/article/details/132691822
Recomendado
Clasificación