video 태그 muted 설정하기 HTML5 에서 video 태그가 추가됨으로써 동영상을 쉽게 삽입할 수 있게 되었다. video 태그에는 몇 가지 속성 값을 정할 수 있다. autoplay, controls, muted 등이 있다. : 비디오 삽입 요소 - HTML: Hypertext Markup Language | MDN HTML 요소는 비디오 플레이백을 지원하는 미디어 플레이어를 문서에 삽입합니다. 오디오 콘텐츠에도 사용할 수 있으나, 요소가 사용자 경험에 좀 더 적합합니다. developer.mozilla.org controls 해당 속성을 명시하면 소리 조절, 동영상 탐색, 일시 정지 및 재시작 기능을 지원하는 컨트롤러 버튼을 제공한다. 컨트롤러 버튼을 사용해서 동영상을 음소거 할 수 있다. ..
JavaScript에서 타임 리프 변수 사용하기 타임 리프를 사용하여 html 파일 작성 시 일반적인 이와 같이 th:inline을 명시해준다. 이후 자바 스크립트 코드는 모두 /**/로 묶어주어야 한다. 따라서 첫 줄에 /**/를 작성해주었다. 또한 타임 리프 변수인 ${paging.page}도 /*[[]]*/로 묶어주어야 하기 때문에 /*[[ ${paging.page} ]]*/라고 작성하였다.
왜 나만 졸려하는걸까.. 나도 뭘 마셔야되나.. JavaScript (JS) DOM (Document Object Model) 예제 예제 1 - 버튼 클릭으로 style 바꾸기 스타일 DOM으로 변경 스타일 변경 하기 const style에 div.style을 저장하고, const color에 style.color를 저장하였는데 이렇게 하지 않고 그냥 div.style.color로 하여도 되긴하다. 위 방법처럼 button에 바로 onclick을 주어도 되고, 이벤트 리스너를 추가해도 된다. 스타일 DOM으로 변경 스타일 변경 하기 button 클릭 시 EventListener가 동작한다. 위 코드와는 다르게 button에 onclick을 주지 않았다. 예제 2 - className 값 1 값 2 값 3..
호이스팅(Hoisting) 스코프 안에 있는 선언들을 모두 스코프의 최상위로 끌어올리는 것이다. 선언문들을 미리 실행하는 것이라 생각하면 된다. 실제 메모리에서는 변화가 없다. var 키워드나 함수 선언문 같은 경우는 코드 실행 전 자바스크립트 내부에서 미리 변수를 선언하고 undefined로 초기화를 해놓는다. let 키워드, const 키워드와 함수 표현식도 호이스팅이 발생하긴 하나 변수를 선언만 해놓을 뿐 초기화하지 않는다. 초기화는 변수 선언문을 만났을 때 수행한다. 이때 선언과 초기화 사이에 일시적으로 변수 값을 참조할 수 없는 구간을 Temporal Dead Zone(TDZ)이라 한다. 예제 1 console.log(typeof(funcHello)); console.log(typeof(func..
JavaScript 비교 연산자 script 언어는 equals()가 없고 연산자로만 표현한다. == 는 기존 equals()와 동일하다. ===와 !==는 타입까지 비교할 때 사용한다. 특수 연산자 delete 객체(Object), 개체의 속성(Property), 배열의 특정 인덱스에 있는 원소를 지우는 연산자이다. var 키워드로 선언된 변수는 삭제할 수 없다. delete가 실행 가능하면, 속성이나 원소가 undefined로 설정된다. 이때 배열의 길이에는 변화가 없다. 실행이 가능하면 true를 반환하고, 실행이 불가능하면 false를 반환한다. 정의할 필요 없이 한 번 쓰고 버리는 변수나 함수 같은 경우 delete 연산자 사용 시 메모리 관리에 효율적이다. in 저장된 객체에 해당되는 속성이 ..
