컴퓨터 기초 소개

프로그래밍 언어

컴퓨터 기초

자바스크립트 소개

JavaScript에 대한 첫 소개

브라우저가 js 프로세스를 실행합니다.

Node.js는 세 부분으로 구성됩니다.

js의 세 가지 쓰기 위치

논평

입력 및 출력 문

변수 소개

변수란 무엇인가?

변수의 사용

가변적인 경우

변수 케이스 팝업 사용자 이름

변수 구문 확장

변수 명명 규칙

2개의 변수 값 변환

변수 요약

데이터 유형 소개

데이터 유형 소개

숫자번호

isNaN

문자열 유형

웹 페이지 경고 상자 팝업

문자열 길이 및 연결

문자열 접합 향상

연령 사례 표시

부울, 정의되지 않음 및 null

typeof는 가변 데이터 유형을 감지합니다.

오자

문자열 유형으로 변환

숫자형 ParseInt 및 ParseFloat로 변환

숫자로 변환 및 암시적 변환

연령 계산

단순 가산기 케이스

부울로 변환

컴파일된 언어와 해석된 언어의 차이점에 대한 확장된 읽기

확장 읽기: 식별자 키워드 예약어

수업 후 숙제

연산자 소개

산술 연산자

표현식 및 반환 값

앞에 증분 연산자

후위 증가 연산자

증분 연산자 연습

사전 증분 및 사후 증분 요약

비교 연산자

논리 연산자

논리 연산자 연습

논리적 인터럽트, 논리적 AND

논리적 인터럽트, 논리적 또는

할당 연산자

연산자 우선순위

프로세스 제어 분기 구조 소개

프로세스 제어

if 분기문

PC방 사례를 입력하세요.

ifelse 이중 분기 문

윤년 사례 결정

if else if 다중 분기 문

등급 사건 심사

삼항 표현

디지털 0 충전 케이스

스위치 문

스위치 주의사항

과일 케이스 쿼리

스위치와 ifelseif의 차이점

독서주기

루프의 목적

for 루프 구문 구조

for 루프 실행 프로세스

전원 끄기 디버깅

for 루프는 동일한 코드를 반복적으로 실행합니다.

for 루프는 다른 코드를 반복적으로 실행합니다.

for 루프는 특정 작업을 반복합니다.

for 루프 케이스

학생 수행 사례 연구(1부)

학생 점수 사례 연구(2부)

한 줄에 별 다섯 개를 인쇄하세요.

이중 for 루프 실행 프로세스

5행 5열로 별 인쇄

n행과 n열로 별 인쇄

역삼각형 케이스 인쇄

곱셈 구구표

for 루프 요약

while 루프

동안의 경우

while 루프를 수행

동안 케이스를 수행

주기 요약

계속 키워드

브레이크 키워드

명명 규칙 및 구문 형식

사이클 작업

배열 소개

배열이란 무엇이며 어떻게 만드는가?

배열 요소에 액세스

트래버스 배열

배열 길이

배열의 합계와 평균 계산

배열에서 최대값 찾기

배열을 문자열로 변환

배열에 새 요소 추가

배열은 1~10개의 값을 저장합니다.

필터 배열 방법

필터 배열 방법 2

배열에서 지정된 요소 삭제(배열 중복 제거)

배열 뒤집기

두 변수 값 교환 검토

버블 정렬 원리

버블정렬

기능 소개

기능이 필요한 이유

기능 사용법

함수를 이용하여 1~100의 누적합 구하기

함수 매개변수

함수를 사용하여 두 숫자의 합과 누적합을 구합니다.

함수 매개변수와 실제 매개변수 간의 매칭 문제

함수 반환 값

함수를 사용하여 두 숫자의 최대값 찾기

함수를 사용하여 배열의 최대값 찾기

return은 함수를 종료하고 하나의 값만 반환할 수 있습니다.

함수 반환 값에 대해 주의할 점 2가지

주서기를 통해 기능 살펴보기

인수 사용

함수를 사용하여 숫자의 최대값 찾기

함수를 사용하여 배열 뒤집기

함수 캡슐화 버블 정렬

윤년을 결정하는 기능을 사용

함수는 다른 함수를 호출할 수 있습니다

2월의 일수 출력

함수를 선언하는 두 가지 방법

범위 소개

자바스크립트 범위

전역변수와 지역변수

자바스크립트에는 블록 수준 범위가 없습니다.

스코프 체인

스코프 체인 케이스

JavaScript 사전 파싱 가이드

준비하다

준비사례

객체 소개

객체란 무엇이며 왜 필요한가요?

객체 리터럴을 사용하여 객체 생성

변수 속성 함수 방식의 차이점

새 개체를 사용하여 개체 만들기

왜 생성자가 필요한가요?

생성자가 객체를 생성합니다(1부)

생성자가 객체를 생성합니다(2부)

생성자와 객체의 차이점

새로운 키워드 실행 프로세스

객체 트래버스

요약 및 과제

내장된 개체 가이드

내장 객체란 무엇인가요?

MDN 문서를 쿼리하는 방법 알아보기

수학적 객체의 수학적 최대값 방법

숫자 게임을 맞춰보세요

날짜 객체 사용

형식 날짜 연 월 일 주

날짜 시간 분 초 형식

날짜 총 밀리초 수(타임스탬프)

카운트다운(1부)

카운트다운(2부)

배열을 만드는 두 가지 방법

배열인지 확인하는 두 가지 방법

배열 요소 추가

배열 요소 삭제

필터 배열

배열 정렬

배열 요소 인덱스 가져오기

어레이 중복 제거 사례

배열을 문자열로 변환

기본 포장 유형

문자열은 불변이다

문자 기반 반환 위치

특정 문자의 위치와 발생 횟수 찾기

위치에 따라 문자를 반환합니다.

가장 자주 등장하는 문자 수 세기(1부)

가장 자주 등장하는 문자 수 세기(2부)

문자열 연결 및 가로채기

문자열을 바꾸고 배열로 변환

단순 데이터 유형 및 복합 데이터 유형 소개

데이터 유형 메모리 할당

단순 데이터 유형 매개변수 전달

복잡한 데이터 유형의 매개변수 전달

웹 API 소개

js 기본과 웹 API의 두 단계 사이의 상관 관계

API와 웹 API

DOM 소개

DOM 소개

getElementByid가 요소를 가져옵니다.

getElementsByTagName 특정 유형의 태그 요소를 가져옵니다.

H5에는 요소를 얻는 새로운 방법이 추가되었습니다.

본문 및 HTML 요소 가져오기

사건의 세 가지 요소

이벤트 프로세스 실행

요소를 조작하여 요소 내용 수정

innerText와 innerHTML의 차이점

요소 조작 - 요소 속성 수정

시분할 인사 케이스

작업 요소 - 양식 속성 수정

JD.com을 모방하여 숨겨진 비밀번호를 일반 텍스트로 표시하는 예(1부)

JD.com을 모방하여 숨겨진 비밀번호를 일반 텍스트로 표시하는 예(2부)

요소 조작 - 스타일 속성 수정

타오바오 모방 QR코드 폐쇄 사례

반복 스프라이트

숨겨진 텍스트 상자 내용 표시

className을 사용하여 스타일 속성 수정

비밀번호 상자 확인 정보

운영 요소 및 임무 요약

배타적 사고(알고리즘)

바이두 피부재생 효과

테이블 대체 행 색상 변경 효과

양식 모두 선택 취소 모두 선택(1부)

양식 모두 선택 취소 모두 선택(2부)

맞춤 속성 값 가져오기

사용자 정의 속성 제거 설정

탭바 전환 레이아웃 분석(중요)

탭바 전환 제작(1편)

탭바 전환 제작(2편)

H5 맞춤 속성

노드 운영과 노드 소개를 배우는 이유

노드 작업의 상위 노드

자식 노드

첫 번째 자식 요소와 마지막 자식 요소

시나 드롭다운 메뉴

노드 작업의 형제 노드

노드 작업: 노드 생성 및 추가

게시 메시지 케이스의 간단한 버전

노드 작업-노드 삭제

메시지 케이스 삭제

노드 작업-복사 노드

동적으로 테이블 생성 - 학생 데이터 생성

동적으로 테이블 생성 - 행 생성

동적으로 테이블 생성 - 셀 생성

동적으로 테이블 생성 - 데이터로 셀 채우기

동적으로 테이블 생성 - 셀 생성 및 삭제

동적으로 테이블 생성 - 작업 추가 및 삭제

document.write가 요소를 생성합니다(이해).

innerHTML과 createElement의 효율성 비교

DOM 키 코어

이벤트 고급 안내

이벤트를 등록하는 두 가지 방법

AttachEvent 등록 이벤트

일정 삭제

DOM 이벤트 흐름 이론

DOM 이벤트 흐름 코드 확인

이벤트 객체란 무엇인가

e.target과 이것의 차이점

기본 동작 차단

이벤트가 터지는 것을 방지

이벤트 위임

텍스트 선택 및 마우스 오른쪽 버튼 클릭 메뉴 비활성화

페이지에서 마우스 좌표 얻기

쥐를 따라가는 천사

자주 사용되는 키보드 이벤트

keyCode는 사용자가 누른 키를 결정합니다.

JD 키 입력 내용 시뮬레이션 사례 연구

JD Express 추적 번호 쿼리 시뮬레이션(1부)

Jingdong Express 추적 번호 쿼리 시뮬레이션(2부)

BOM 소개

BOM 개요

페이지 로드 이벤트

창 크기 조정 이벤트

타이머 설정시간 초과

5초 후 자동으로 닫히는 콜백 기능과 광고

타이머 지우기

타이머 설정 간격

카운트다운 효과

타이머 지우기

SMS 케이스 보내기

이것이 문제를 지적한다

동기식 및 비동기식

동기 태스크 및 비동기 태스크 실행 프로세스

JS 실행 메커니즘

위치 개체의 공통 속성

5초 후 해당 페이지로 이동

URL 매개변수 가져오기

일반적인 위치 방법

네비게이터 객체

히스토리 객체

PC에서의 웹페이지 특수효과 소개

offsetLeft 및 offsetTop은 요소 오프셋을 가져옵니다.

offsetWidth 및 offsetHeight는 요소 크기를 가져옵니다.

오프셋과 스타일의 차이점

상자 안의 마우스 좌표를 가져옵니다.

모달 상자 끌기(위)

모달 상자 드래그(가운데)

모달 상자 드래그(아래)

Jingdong의 돋보기 효과를 모방한 페이지 구조 구축

숨겨진 장벽과 큰 상자를 보여주는 모조 Jingdong 돋보기 효과

모조 Jingdong 돋보기 효과 폐색 레이어가 마우스를 따릅니다.

모방 JD 돋보기 효과는 폐색 레이어의 이동 범위를 제한합니다.

모조 Jingdong 돋보기 효과 대형 그림 운동

클라이언트 시리즈

즉시 기능 실행

Taobao flexiJS 소스 코드 분석의 핵심 원칙

Taobao의flexibleJS 소스 코드 분석 페이지쇼 이벤트

스크롤 시리즈

모방 Taobao 고정 사이드바(1부)

모방 Taobao 고정 사이드바(아래)

세 가지 주요 시리즈 요약

마우스오버와 마우스엔터의 차이점

애니메이션 원리

간단한 애니메이션 기능 캡슐화

애니메이션 기능은 다양한 요소에 대해 다양한 타이머를 기록합니다.

애니메이션 완화의 원리

애니메이션 완화의 기본 코드 구현

여러 대상 값 간 이동을 위한 애니메이션 완화

애니메이션 완화를 위한 콜백 함수 추가

애니메이션 기능 활용

웹페이지 캐러셀 차트 구조 구축

웹 페이지 캐러셀 - 마우스가 지나갈 때 왼쪽 및 오른쪽 버튼을 표시하고 숨깁니다.

웹페이지 캐러셀 - 동적으로 생성된 작은 원

웹 페이지 회전식 차트 - 작은 원 독점 생각

웹 페이지 캐러셀 - 작은 원을 클릭하여 사진을 스크롤하세요.

웹 페이지 캐러셀 - 오른쪽 버튼으로 원활한 스크롤

웹 페이지 캐러셀 - 첫 번째 사진 복제

웹페이지 캐러셀의 작은 원은 오른쪽 버튼으로 변경됩니다.

웹 페이지 캐러셀 - 두 개의 작은 BUG 솔루션

웹페이지 캐러셀 이미지-왼쪽 버튼 기능 제작

웹 페이지 캐러셀 - 자동 재생 기능

스로틀 밸브 및 로직 인터럽트 애플리케이션

애니메이션으로 맨 위로 돌아가기

Somersault 클라우드 케이스

모바일 웹페이지 특수효과 소개

모바일 터치 이벤트

모바일 TouchEvent 터치 이벤트 객체

모바일에서 요소 드래그

모바일 단말 캐러셀 차트 구조 구축

모바일 캐러셀 차트-레이아웃 분석

모바일 캐러셀 스크롤 사진

모바일 회전식 원활한 스크롤

classList 클래스 이름 작업

모바일 캐러셀 차트 - 작은 점이 변경 사항을 따릅니다.

모바일 단말기의 회전식 차트 - 손가락으로 회전식 차트 드래그

모바일 캐러셀 - 손가락을 밀어 이전 사진과 다음 사진을 재생합니다.

모바일 캐러셀 이미지 리바운드 효과

맨 위로 돌아가기 모듈 생산

모바일 단말의 클릭 이벤트 300ms 지연 문제 해결

faskclick 플러그인 사용법

Swiper 플러그인 사용 참고서 관련 파일

모바일 캐러셀 이미지 - 문법 사양에 따라 사용됨

스와이프 플러그인 사용 매개변수 변경

기타 모바일 플러그인 및 사용 요약

비디오 플러그인 zy.media.js 사용

부트스트랩 캐러셀

알리바바 쇼 캐러셀 사진 제작

로컬 스토리지 가이드

로컬 스토리지 세션Storage

로컬 스토리지의 localStrge

사용자 이름 대소문자 기억

jQuery 소개

자바스크립트 라이브러리

jQuery 개요

jQuery 입력 기능의 기본 사용법

jQuery 최상위 객체

DOM 객체와 jQuery 객체

DOM 객체와 jQuery 객체를 서로 변환

jQuery 공통 API 가이드

jQuery 기본 및 계층적 선택기

jQuery 암시적 반복

jQuery 필터 선택기

jQuery 필터 방법 - 부모 및 자식 요소 선택

시나 드롭다운 메뉴

jQuery의 기타 필터링 방법

jQuery 독점 아이디어

타오바오 의류 부티크 케이스

jQuery 체인 프로그래밍

jQuery 수정 스타일 CSS 방법

jQuery 수정 스타일 작업 클래스

탭바 전환 케이스

jQuery 클래스 작업과 className의 차이점

jQuery 표시 및 숨기기 효과

jQuery 슬라이딩 효과 및 이벤트 전환

jQuery 중지 애니메이션 대기열

jQuery 페이드 인 및 강조 표시

jQuery 사용자 정의 애니메이션 애니메이션 방법

Honor of Kings 아코디언 케이스 레이아웃 분석

영광의 왕 아코디언 케이스 제작

jQuery 속성 조작

장바구니 모듈 - 모두 선택(1부)

장바구니 모듈 - 모두 선택(2부)

jQuery 콘텐츠 텍스트 값

장바구니 모듈 - 항목 수를 늘리거나 줄입니다.

장바구니 모듈 - 상품 소계 수정(1부)

장바구니 모듈 - 상품 소계 수정(중)

장바구니 모듈 - 상품 소계 수정(2부)

jQuery는 각 메소드마다 객체를 반복합니다.

데이터를 반복하는 jQuery

장바구니 모듈 - 총 개수와 합계를 계산합니다.

요소 생성, 추가, 삭제

장바구니 모듈클린 장바구니

장바구니 모듈 - 선택한 항목에 배경색 추가

jQuery 크기 방법

jQuery 위치 방법

jQuery는 헤드 메소드로 롤링됩니다.

애니메이션으로 맨 위로 돌아가기

엘리베이터 내비게이션 사례 - 엘리베이터 내비게이션 숨기기 표시

엘리베이터 내비게이션 사례 - 대상 위치로 스크롤하려면 클릭하세요.

엘리베이터 탐색 사례 - 현재 클래스를 추가하려면 현재 li를 클릭하세요.

엘리베이터 탐색 사례 - 슬라이딩 페이지 엘리베이터 탐색이 자동으로 현재 클래스를 추가합니다.

엘리베이터 내비게이션 케이스 스로틀 밸브(뮤텍스 잠금)

jQuery 이벤트 소개

하나 이상의 이벤트 바인딩에 대한 이벤트 처리

on은 이벤트 위임을 구현하고 이벤트를 동적 요소에 바인딩합니다.

웨이보 게시 사례

오프 바인딩 해제 이벤트

jQuery는 자동으로 이벤트를 트리거합니다.

jQuery 이벤트 객체

jQuery의 다른 방법 소개

jQuery 객체 copyextend(선택 사항)

jQuery 다중 라이브러리 공존

Waterfall 플러그인 사용법

이미지 지연 로딩 기술

전체 화면 스크롤 플러그인 사용(선택 사항)

부트스트랩 구성요소

bootstrapJS 플러그인

알리 바이슈

전체 목록 레이아웃 기능 요구 사항 분석

todilist 핵심 아이디어 및 로컬 저장 형식

할 일 목록 Enter를 눌러 로컬 저장소 데이터를 읽으세요.

할일 목록 Enter를 눌러 최신 데이터를 로컬 저장소에 저장하세요

할 일 목록 로컬 저장소 데이터가 렌더링되어 페이지에 로드됩니다.

할 일 목록 현재 색인 번호를 얻으려면 삭제 버튼을 클릭하세요.

할 일 목록 삭제 버튼을 클릭하여 삭제 작업을 완료하세요.

해당 데이터의 완료 속성을 수정하려면 확인란을 클릭하세요.

Todolist가 진행 중이며 완료되었습니다.

todolist는 진행 중인 항목과 완료된 항목의 수를 계산합니다.

영상 녹화 기능 소개

포인트 영역 레이아웃 스타일

지도 영역 레이아웃 스타일

사용자 영역 레이아웃 스타일

주문 영역 레이아웃 스타일

판매 구역 레이아웃 스타일

채널 및 분기 레이아웃 스타일

랭킹 영역 레이아웃 스타일-참고

데이터 시각화 프로젝트 소개

어떤 데이터 시각화

데이터 시각화 프로젝트 개요

EChart 소개

ECharts의 기본 사용

다양한 차트 유형 선택

ECharts 프로젝트 구성(1부)

ECharts 그리드 구성

ECharts 관련 구성(가운데)

ECharts 프로젝트 구성(2부)

할인 차트 생성 및 구성 항목 요약

데이터 시각화 프로젝트 적응 솔루션 분석

데이터 시각화 프로젝트 적응 계획

프로젝트 준비 및 자동 새로 고침 브라우저 플러그인 따르기

시각화 프로젝트 본문 및 뷰포트 제작

시각화 프로젝트 열 컨테이너

테두리 그림 사용 시나리오 및 절단 원리

테두리 이미지 사용 구문

퍼블릭 패널 스타일 제작(1부)

퍼블릭 패널 스타일 제작(2부)

클래스 이름으로 글꼴 아이콘 호출

데이터 시각화 프로젝트 개요 영역 모듈 제작

데이터 시각화 프로젝트 모니터링 영역 레이아웃 분석

데이터 시각화 프로젝트 모니터링 영역 탭 바 전환 분석

데이터 시각화 프로젝트 - 모니터링 영역의 원활한 스크롤

포인트 분배 포인트 모듈 레이아웃

포인트 분배 포인트 소개 차트

ECharts 원형 차트 - 도구 설명 매개변수 의미

ECharts 원형 차트 시리즈 매개변수 의미

위치분배 모듈 맞춤형 구성(1편)

위치분배 모듈 맞춤형 구성(2편)