자바스크립트 학습 경험-JS 튜토리얼-php.cn

자바스크립트 학습 경험

一个新手

풀어 주다： 2017-09-06 10:43:16

원래의

3514명이 탐색했습니다.

1. 서문:

얼마 전에 Little Red Book(JavaScript를 사용한 고급 프로그래밍)을 읽었지만 읽을 계획이 없었고 자세히 메모하지도 않았습니다. 읽고 난 후 약간의 느낌이 들었습니다. 뭔가 허전하고 뭔가 잘못된 것 같은 느낌이 들었습니다. 와, 프론트엔드 JS 개발자도 프론트엔드를 어떻게 하는지 배우지 못하는 것 같아요. 백엔드가 js를 배웠으니 죽을지 말지 결정하세요.

그래서 나는 그것을 읽고, 다시 읽고, 내 인상을 높이고 나중에 참고하고 토론할 수 있도록 독서 노트를 만들기 위해 그것에 대해 블로그에 쓰기로 결정했습니다.

주의 사항: 노트의 단어는 주관적이므로 지식을 강조하여 기록해야 합니다.

2. JavaScript의 역사

원산지: 지난 세기말인 1995년에 넷스케이프가 네비게이터 브라우저를 출시했다고 합니다. 회사는 정적 HTML뿐만 아니라 동적 효과도 추구하고 있으며, 특히 양식 입력이 적법한지 여부를 백엔드에서 확인할 때까지 기다리지 마십시오. 몇 분씩 기다리던 우리는 이제 일부 웹 사이트가 깨졌다고 불평하면서 끄고 싶지 않은 채 10초를 기다립니다.
실습: 목표가 있으면 실행하세요. Netscape에는 많은 유명인이 있습니다. Brendan Eich는 처음 나왔을 때 JavaScript를 10일 만에 만들었습니다. .인기스타를 따라잡기 위해 자바 인기도를 자바스크립트로 바꾸었기 때문에 사실상 서로 아무런 관련이 없습니다.
경쟁: Netscape에 js가 있는 것을 보고 Microsoft는 그것이 좋지 않다고 느꼈고 내 IE가 죽을 것이라고 느꼈습니다. 동시에 js의 미래가 밝다고 느꼈기 때문에 JavaScript를 만들었습니다. JScript라는 구현입니다.
표준: Netscape와 Microsoft 간의 경쟁으로 인해 등장한 JS는 업계의 우려로 인해 버전 불일치로 이어졌습니다. ECMA 조직은 이를 위해 나섰고, 마침내 1997년에 ECMAScript를 표준으로 내놓았습니다. 여기서 ECMAscript와 JavaScript는 같은 것을 표현한다고 볼 수 있습니다

3. ECMAScript

ECMAScript(이하 ES)는 ECMA-262에 의해 공식화되었으며 ES는 주로 언어의 문법적 기반이며 표준입니다. ES와 JS를 굳이 구분하자면 ES가 기본 언어 표준이고, JS는 이 표준을 기반으로 구현된 언어입니다.

ES 버전 정보: ES는 1997년 공식화 된 이후 많은 버전을 거쳤습니다. 이전 버전은 모두 사소한 수정이었습니다. 중요 버전:

ES3, 세 번째 버전은 표준

2009에 대한 최초의 실제 수정입니다. ES5는 현재 모든 주요 인기 브라우저에서 지원됩니다.

2015 ES6 게시도 인기를 얻고 있습니다.

2015년 이후 매년 버전이 출시될 예정이지만, 브라우저에서는 아직 이를 지원하지 않습니다.

4. JavaScript 구현

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

1 ECMAScript: 핵심 부분은 js의 문법적 기초이며 나중에 문법을 계속 작성할 것입니다.
2.DOM(Text Object Model): HTML 문서를 작동하기 위한 애플리케이션 프로그래밍 인터페이스입니다. DOM 정보:

DOM의 출현으로 페이지를 다시 로드하지 않고도 웹 페이지의 모양과 내용을 변경할 수 있는 동적 HTML(DHTML)을 구현할 수 있게 되었습니다.
DOM으로 인한 문제: 주로 호환성 측면에서 Netscape와 Microsoft는 각자의 의견을 갖고 있어 브라우저 비호환성을 초래합니다. 이 문제는 해결되지 않았습니다. W3C는 DOM
DOM 레벨: DOM1, DOM2, DOM3을 계획하기 시작했습니다. 이는 DOM이 지속적으로 개선되고 있음을 의미합니다.

3.BOM(브라우저 모델) : BOM을 사용하여 브라우저에 표시되는 페이지 이외의 부분을 제어합니다.

5. JavaScript 사용법 :

(1) 태그 속성 : 웹 페이지에서 js를 사용하는 핵심은 6가지 속성이 있는

<script> 태그: <h3><ol class=" list-paddingleft-2">
<code><script>

标签，其有6个属性：

async：可选，表示立即下载脚本，但不妨碍页面中的其他操作。也就是异步脚本，只适用于外部脚本文件。
defer：可选，表示脚本可以延迟到文档完全被解析和显示后在执行。也就是延迟脚本，只适合与外部脚本文件。
src：可选，表示包含要执行代码的外部文件。
type：默认text/Javascript。默认执行js，可以不用指定。
charset：可选，表示通过src属性指定代码的字符集，大多数浏览器会忽略它的值，很少人使用。
language：已废弃
常用就前4个

(2)使用：使用`<script >`

async: 선택 사항, 스크립트를 즉시 다운로드하지만 다른 작업을 방해하지 않음을 나타냄 페이지에서. 즉, 비동기 스크립트는 외부 스크립트 파일에만 적용됩니다.

defer: 선택 사항이며 문서가 완전히 구문 분석되고 표시될 때까지 스크립트가 지연될 수 있음을 나타냅니다. 즉, 지연된 스크립트는 외부 스크립트 파일에만 적합합니다.

src: 선택 사항이며 실행할 코드가 포함된 외부 파일을 나타냅니다.

유형: 기본 텍스트/Javascript. Node.js는 기본적으로 실행되므로 지정할 필요가 없습니다.

charset: 선택 사항이며 src 속성을 통해 지정된 코드의 문자 집합을 나타냅니다. 대부분의 브라우저는 해당 값을 무시하며 이를 사용하는 사람은 거의 없습니다. 🎜🎜🎜🎜언어: Obsolete🎜처음 4개가 일반적으로 사용됩니다🎜🎜🎜(2) 사용법: <script > 사용: 두 가지 작업이 있습니다: 🎜🎜1. 태그 내에 코드를 작성하는 것, 즉 HTML에 코드를 삽입하는 것은 권장되지 않습니다. 예: 🎜🎜🎜🎜
```
<script>
 function helloWorld(){
    alert("hello world!");
 }
 helloWorld();</script>
```
로그인 후 복사
🎜2. src 속성을 통해 외부 파일을 도입하는 또 다른 방법입니다. 🎜🎜🎜🎜
```
<script src="js/hello.js"></script>
```
로그인 후 복사
🎜외부 참조 js 파일을 최대한 사용하세요. 장점: 🎜🎜🎜🎜유지 관리성: html에 포함된 코드는 유지 관리가 어렵고 별도의 js 파일로 유지 관리하기가 훨씬 쉽습니다. 🎜
可缓存：浏览器可以根据具体的设置缓存链接的所用外部js文件
适应未来：通过外部文件来包含js无须对XHML的特别处理和注释hack。HTML和XHTML的包含文件的语法相同。

特别注意：<script>在使用了src属性后，不要在内嵌代码，此时的内嵌的代码不会被执行。只会执行src对应文件的代码。

(3)位置：关于`<script>` 在HTML文档中的位置：

在HTML4中规定<script> 标签可以放在 <head>和<body> 标签内。
由于浏览器解析HTML文档是由上到下，且在遇到<script> 标签后会先解析和执行js代码，并中断HTML的加载，所以放在<head> 标签中是会使得HTML文档可视内容中断加载。
画重点:所以<script> 标签的位置首考虑放在<body> 标签底部。例如：

<html>
    <head>
       <title>hello js</title>
    </head>
    <body>
        <p>hello js!</p>
        <!-- js文件放在body底部 -->
        <script src="example.js"></script>
    </body></html>

로그인 후 복사

六、JavaScript的平稳退化方案

什么是平稳退化：就是有些浏览器不支持js，当然现在几乎没有浏览器这么菜啦，还有就是js功能被禁用。这时就需要没有js的情况下你的网页怎么友好一点交互，不会搞得太难看，太尴尬。
使用<noscript> 标签，应用场景：

浏览器不支持JavaScript
浏览器支持脚本，但脚本被禁止了

例子：当浏览器不支持js或禁用js时就会显示出noscript标签中的内容，若浏览器能执行js则noscript就被隐藏。

<html>
    <head>
        <script src="example.js"></script>
    </head>
    <body>
        <noscript>
         <p>本页面需要浏览器支持JavaScript</p>
        </noscript>
    </body></html>

로그인 후 복사

위 내용은 자바스크립트 학습 경험의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!