Geek Academy 자바스크립트 동영상 자료 공유-JS 튜토리얼-php.cn

Geek Academy 자바스크립트 동영상 자료 공유

巴扎黑

풀어 주다： 2017-08-28 17:59:45

원래의

1331명이 탐색했습니다.

"Geek Academy JavaScript 비디오 튜토리얼"에서는 JavaScript에 대해 자세히 소개합니다. JavaScript는 문자 그대로의 스크립팅 언어이자 클라이언트 측 웹 개발에 널리 사용되는 스크립팅 언어입니다. 현재 수백만 개의 웹 페이지에서 디자인 개선, 양식 유효성 검사, 브라우저 감지, 쿠키 생성 등을 위해 사용됩니다.

JavaScript는 웹 애플리케이션 개발에 널리 사용되는 네트워크 스크립팅 언어로, 사용자에게 더욱 부드럽고 아름다운 탐색 효과를 제공하기 위해 웹 페이지에 다양한 동적 기능을 추가하는 데 자주 사용됩니다. 일반적으로 JavaScript 스크립트는 HTML에 삽입하여 기능을 실현합니다.

은 해석된 스크립트 언어입니다(코드는 미리 컴파일되지 않음).

주로 HTML(Standard Universal Markup Language의 응용 프로그램) 페이지에 대화형 동작을 추가하는 데 사용됩니다.

HTML 페이지에 직접 삽입할 수도 있지만, 별도의 js 파일로 작성하면 구조와 동작의 분리가 용이해집니다.

크로스 플랫폼 기능은 대부분의 브라우저를 지원하므로 여러 플랫폼(예: Windows, Linux, Mac, Android, iOS 등)에서 실행할 수 있습니다.

Geek Academy 자바스크립트 동영상 자료 공유

동영상 재생 주소: http://www.php.cn/course/204.html

자바스크립트를 배울 때 DOM 연산에 주의해야 하는 점은 다음과 같습니다.

1. 노드 생성

createElement()
var node = document.createElement(“div”);

로그인 후 복사

말할 것도 없이 요소 노드를 생성하지만 이 노드는 문서에 자동으로 추가되지 않습니다.

2. 텍스트 노드 만들기

createTextNode()
var value = document.createTextNode(“text”);

로그인 후 복사

요소 노드에 콘텐츠를 추가하는 데 일반적으로 사용되며 문서에 자동으로 추가되지 않는 텍스트 노드를 만듭니다.
innerHTML을 알고 있지만 이 방법은 모르는 사람이 많습니다. 삽입된 내용에 HTML 형식이 없으면 createTextNode를 사용하는 것이 innerHTML보다 안전하고, innerText는 브라우저 비호환 문제가 있으므로 createTextNode를 사용하는 것이 쉽습니다. .

3. 노드를 끝에 삽입하세요.

appendChild()
node.appendChild(value);

로그인 후 복사

노드를 끝에 삽입하세요. 위에서 생성한 두 개의 노드는 문서에 자동으로 추가되지 않으므로 삽입하려면 반드시appendChild를 사용해야 합니다.
새로운 노드라면 맨끝까지 삽입되고, 기존 노드라면 맨끝으로 이동하는 경우가 많습니다. 이 점을 이해하신 후, 다음과 같은 방법으로 조합하시면 됩니다. 노드를 쉽게 이동하고 조작할 수 있습니다.

4. 대상 노드 앞에 노드를 삽입합니다.

insertBefore()
var node = document.createElement(“div”);
var _p = document.createElement(“p”);
var _span = document.createElement(“span”);
node.appendChild(_p);
node.insertBefore(_span, _p);

로그인 후 복사

노드 앞에 삽입됩니다. 두 번째 매개변수는 선택사항입니다. 기본적으로 추가됩니다. 문서 끝에는appendChild와 동일합니다.
마찬가지로,appendChild와 insertBefore는 노드가 이미 존재하는 경우 자동으로 원래 노드를 먼저 삭제한 다음 지정한 위치로 이동합니다.
노드를 앞으로 이동하는 팁:

if (node.parentNode.firstChild)
node.parentNode.insertBefore(node, node.parentNode.firstChild);else node.parentNode.appendChild(node);

로그인 후 복사

node.cloneNode(true);
node.cloneNode(false);
위의 div 노드를 복사하고, 매개변수는 true로, 전체 노드와 해당 내용을 false로 복사합니다. 노드에는 내부 콘텐츠가 필요하지 않으며 복사 후 새 노드는 문서에 자동으로 삽입되지 않습니다. 삽입하려면 방법 3과 4를 사용해야 합니다.

6. 노드 삭제