JavaScript学习心得之概述


Posted in Javascript onJanuary 20, 2015

  一、JavaScript是一种专为与网页交互而设计的脚本语言,它的的组成

ECMAScript(核心) DOM(文档对象模型) BOM(浏览器对象模型)

1.1ECMAScript

     ECMA-262定义的ECMAScrip与Web浏览器没有依赖关系,ECMA-262定义的只是这门语言的基础,提供核心语言功能

ECMAScript是通过ECMA-262标准化的脚本语言,ECMA-262规定语言的:语法、类型、语句、关键字、保留字、操作符、对象

1.2 DOM(Document Object Modle)
     DOM是针对XML但是经过扩展用于HTML的应用程序编程接口(API,Application Programming Interface),提供访问和操作网页内容的方法和接口

DOM把整个页面映射为一个多层节点结构,HTML或者XML等页面中的每个组成部分都是某种类型的节点,这些节点又包含不同类型的数据。

1.3 BOM(Bower Object Modle)

控制浏览器显示的页面以外的部分,BOM只处理浏览器窗口和框架,提供与浏览器交互的方法和接口

二、<script>元素
2.1引用javascript文件
 外部引用javascript文件:

<script type="text/javascript" src="../../XX.js"></script>

页面嵌入javascript代码

<script type="text/javascript">
//javascript代码
</script>

包含在<script>元素内部的JavaScript代码将被从上至下依次解释

2.2 <script>元素的属性

defer延迟脚本:告诉浏览器立即下载,脚本会被延迟到整个页面都被解析完才执行, defer只适用于外部引入的脚本文件

<!DOCTYPE html>

<html>

    <head>

         <script type="text/javascript" defer="defer" src="example.js"></script>

    </head>

</html>

虽然<script>标签位于<head>标签内,但是demo.js会延迟到浏览器遇到</html>后才执行。

async异步脚本:必让页面等待脚本的下载和执行,从而异步加载页面其他内容
同defer一样只适用于外部引入的脚本文件,async告诉浏览器立即下载文件,但与defer不同的是标记不async脚本并不保证按照指定它们的先后顺序执行,建议异步脚本不要在加载期间修改DOM

<!--异步脚本-->

<script type="text/javascript" async="async" src="example1.js"></script>

<script type="text/javascript" async="async" src="example2.js"></script>

2.3 <noscript>元素的属性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>test</title>

<!--延迟脚本-->

<scripttype="text/javascript" defer="defer" src="example.js"></script>

<!--导部脚本-->

<script type="text/javascript" async="async" src="example1.js"></script>

<script type="text/javascript" async="async" src="example2.js"></script>

</head>

<body>

   <noscript>

    <p>本页显示需要浏览器支持(启用)Javascript

      </noscript>

</body>

</html>

浏览器不支持脚本

浏览器支持脚本,但脚本被禁用,浏览器就会显示<noscript>中的内容
这个页面会在脚本无效的情况下,向用户显示一条信息,而在启用了脚本的浏览器中,用户永远也不会看到它

以上就是本文的全部内容了,希望大家能够喜欢,本系列将持续更新。

Javascript 相关文章推荐
捕获浏览器关闭、刷新事件不同情况下的处理方法
Jun 02 Javascript
如何在父窗口中得知window.open()出的子窗口关闭事件
Oct 15 Javascript
js arguments,jcallee caller用法总结
Nov 30 Javascript
详解js闭包
Sep 02 Javascript
javascript获取指定区间范围随机数的方法
Sep 08 Javascript
深入理解Vue官方文档梳理之全局API
Nov 22 Javascript
vue中v-for循环给标签属性赋值的方法
Oct 18 Javascript
Vue 中文本内容超出规定行数后展开收起的处理的实现方法
Apr 28 Javascript
Node.js 实现远程桌面监控的方法步骤
Jul 02 Javascript
react 不用插件实现数字滚动的效果示例
Apr 14 Javascript
JS使用setInterval计时器实现挑战10秒
Nov 08 Javascript
JavaScript中document.activeELement焦点元素介绍
Nov 27 Javascript
DOM基础教程之使用DOM
Jan 19 #Javascript
DOM基础教程之模型中的模型节点
Jan 19 #Javascript
javascript正则表达式使用replace()替换手机号的方法
Jan 19 #Javascript
javascript正则表达式之search()用法实例
Jan 19 #Javascript
jQuery中delegate()方法用法实例
Jan 19 #Javascript
jQuery中die()方法用法实例
Jan 19 #Javascript
jQuery中live()方法用法实例
Jan 19 #Javascript
You might like
百度站点地图(百度sitemap)生成方法分享
2014/01/09 PHP
PHP查询并删除数据库多列重复数据的方法(利用数组函数实现)
2016/02/23 PHP
PHP MYSQL简易交互式站点开发
2016/12/27 PHP
PHP实现基于3DES算法加密解密字符串示例
2018/08/24 PHP
解决jquery实现的radio重新选中的问题
2015/07/03 Javascript
AngularJS入门教程之更多模板详解
2016/08/19 Javascript
AngularJS通过$sce输出html的方法
2016/09/22 Javascript
js基础之DOM中document对象的常用属性方法详解
2016/10/28 Javascript
vue中用动态组件实现选项卡切换效果
2017/03/25 Javascript
JS作用域链详解
2017/06/26 Javascript
jQuery实现获取table中鼠标click点击位置行号与列号的方法
2017/10/09 jQuery
小程序中canvas的drawImage方法参数使用详解
2019/07/04 Javascript
[22:07]DOTA2-DPC中国联赛 正赛 iG vs Magma 选手采访
2021/03/11 DOTA
Python常见文件操作的函数示例代码
2011/11/15 Python
Python内置数据结构与操作符的练习题集锦
2016/07/01 Python
Python获取暗黑破坏神3战网前1000命位玩家的英雄技能统计
2016/07/04 Python
Python文件循环写入行时防止覆盖的解决方法
2018/11/09 Python
对python多线程中Lock()与RLock()锁详解
2019/01/11 Python
Python实现九宫格式的朋友圈功能内附“马云”朋友圈
2019/05/07 Python
十分钟搞定pandas(入门教程)
2019/06/21 Python
Python OpenCV 使用滑动条来调整函数参数的方法
2019/07/08 Python
python使用百度文字识别功能方法详解
2019/07/23 Python
Python使用百度翻译开发平台实现英文翻译为中文功能示例
2019/08/08 Python
Python定义函数时参数有默认值问题解决
2019/12/19 Python
python GUI库图形界面开发之PyQt5动态加载QSS样式文件
2020/02/25 Python
Python flask框架实现浏览器点击自定义跳转页面
2020/06/04 Python
python 贪心算法的实现
2020/09/18 Python
HTML5中视频音频的使用详解
2017/07/07 HTML / CSS
幸福家庭标语
2014/06/27 职场文书
单位委托书怎么写
2014/08/02 职场文书
高中美术教师事迹材料
2014/08/22 职场文书
国庆促销活动总结
2014/08/29 职场文书
清洁工岗位职责
2015/02/13 职场文书
python基础之匿名函数详解
2021/04/21 Python
html2 canvas svg不能识别的解决方案
2021/06/03 HTML / CSS
Go语言基础函数基本用法及示例详解
2021/11/17 Golang