[JavaScript] AJAX 통신을 이용해서 데이터 가져오기
·
JavaScript
코드더보기1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495<head>    <meta charset="UTF-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewpo..
[JavaScript] toggle() 활용 예제 코드
·
JavaScript
12345678910111213141516171819202122232425262728<head>    ...    <style>        .like--heart {            font-size: 100px;            color: gray;    &..
[JavaScript] BOM : document 객체 ★
·
JavaScript
document 객체  - 웹 문서에서 태그를 만나면 만들어지는 객체  - HTML 문서 정보를 가지고 있음  노드 접근하기#  태그 선택자 이용1234567document.querySelector("태그명") // 또는 // 컬렉션 타입 반환// 인덱스 연산자 []를 이용해서 각 노드에 접근 가능document.getElementsByTagName("태그명"); cs" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 #  id 선택자 이용12345document.querySelector("#아이디명") // 또는 do..
[JavaScript] HTML 렌더링과 JavaScript 실행
·
JavaScript
HTML 렌더링 순서1. 서버에서 HTML 문서를 받아옴2. HTML 문서를 파싱하여 DOM 트리를 생성함3. CSS 파일을 로드/파싱하여 CSSOM 트리를 생성함4. DOM 트리와 CSSOM 트리를 결합하여 렌더트리를 생성함5. 렌더트리를 기반으로 레이아웃을 계산하고, 실제로 화면에 표시될 요소를 결정함6. 브라우저에서 화면에 표시함 JavaScript 실행 순서1. HTML 파싱 중 태그를 만나면, 해당 스크립트를 다운로드함2. 스크립트를 파싱하여 실행 가능한 코드를 생성함    - 이때, 오류가 있으면 실행되지 않음3. 생성된 코드를 실행함4. 다음 태그를 만날 때까지 파싱과 실행을 반복함 #  유의사항  - 스크립트 코드가 HTML 파싱 과정에서 실행되는 순서에 따라 예기치 못한 결과가 발생할..
[JavaScript] 이벤트
·
JavaScript
이벤트 등록123456789// 요소 선택let 변수명 = document.querySelector("요소"); 변수명.addEventListener("이벤트종류", function() {    // 이벤트 발생 시 실행 코드});   // 또는변수명.addEventListener("이벤트종류", 함수명); // 함수명은 괄호 없이cs" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 123456// click 이벤트는 bu..

티스토리툴바