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 相关文章推荐
JS模拟自动点击的简单实例
Aug 08 Javascript
CSS鼠标响应事件经过、移动、点击示例介绍
Sep 04 Javascript
javascript实现playfair和hill密码算法
Dec 07 Javascript
使用jquery动态加载js文件的方法
Dec 24 Javascript
JavaScript函数详解
Feb 27 Javascript
js简单的点击返回顶部效果实现方法
Apr 10 Javascript
js游戏人物上下左右跑步效果代码分享
Aug 28 Javascript
javascript中window.open在原来的窗口中打开新的窗口(不同名)
Nov 15 Javascript
原生JS简单实现ajax的方法示例
Nov 29 Javascript
angularjs获取到My97DatePicker选中的值方法
Oct 02 Javascript
微信小程序用户位置权限的获取方法(拒绝后提醒)
Nov 15 Javascript
微信小程序实现单个或多个倒计时功能
Nov 01 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
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
2016/04/01 Javascript
AngularJs学习第八篇 过滤器filter创建
2016/06/08 Javascript
JavaScript函数节流概念与用法实例详解
2016/06/20 Javascript
Vue.js每天必学之指令系统与自定义指令
2016/09/07 Javascript
jquery实现的回旋滚动效果完整实例【附demo源码下载】
2016/09/20 Javascript
详解Webstorm 新建.vue文件支持高亮vue语法和es6语法
2017/10/26 Javascript
微信小程序使用image组件显示图片的方法【附源码下载】
2017/12/08 Javascript
推荐10款扩展Web表单的JS插件
2017/12/25 Javascript
实现jquery放大镜的两种方法
2018/02/22 jQuery
详解plotly.js 绘图库入门使用教程
2018/02/23 Javascript
微信小程序登录换取token的教程
2018/05/31 Javascript
使用iView Upload 组件实现手动上传图片的示例代码
2018/10/01 Javascript
jQuery实现的隔行变色功能【案例】
2019/02/18 jQuery
js控制随机数生成概率代码实例
2019/03/21 Javascript
深入了解响应式React Native Echarts组件
2019/05/29 Javascript
jQuery 筛选器简单操作示例
2019/10/02 jQuery
[46:10]2014 DOTA2国际邀请赛中国区预选赛 CnB VS HGT
2014/05/21 DOTA
[42:23]完美世界DOTA2联赛PWL S3 Forest vs Rebirth 第二场 12.10
2020/12/13 DOTA
Python程序设计入门(5)类的使用简介
2014/06/16 Python
python脚本设置系统时间的两种方法
2016/02/21 Python
pycharm下打开、执行并调试scrapy爬虫程序的方法
2017/11/29 Python
Python+Django搭建自己的blog网站
2018/03/13 Python
Python图像处理之直线和曲线的拟合与绘制【curve_fit()应用】
2018/12/26 Python
python3.6环境安装+pip环境配置教程图文详解
2019/06/20 Python
python针对mysql数据库的连接、查询、更新、删除操作示例
2019/09/11 Python
在Python中使用MySQL--PyMySQL的基本使用方法
2019/11/19 Python
Django admin 实现search_fields精确查询实例
2020/03/30 Python
Crucial英睿达法国官网:内存条及SSD固态硬盘升级
2018/07/13 全球购物
小学运动会口号
2014/06/07 职场文书
小学教师师德师风个人整改措施
2014/09/18 职场文书
一般纳税人申请报告
2015/05/18 职场文书
文艺晚会开场白
2015/05/29 职场文书
2016年小学教师师德承诺书
2016/03/25 职场文书
python Tkinter的简单入门教程
2021/04/11 Python
Python函数中apply、map、applymap的区别
2021/11/27 Python
MongoDB数据库部署环境准备及使用介绍
2022/03/21 MongoDB