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 相关文章推荐
jquery.alert 弹出式复选框实现代码
Jun 15 Javascript
jQuery实现下拉框选择图片功能实例
Aug 08 Javascript
jquery+php随机生成红包金额数量代码分享
Aug 27 Javascript
JavaScript 轮播图和自定义滚动条配合鼠标滚轮分享代码贴
Oct 28 Javascript
js实现横向拖拽导航条功能
Feb 17 Javascript
JS实现复选框的全选和批量删除功能
Apr 05 Javascript
详解微信小程序 登录获取unionid
Jun 27 Javascript
Angularjs实现下拉框联动的示例代码
Aug 22 Javascript
React教程之封装一个Portal可复用组件的方法
Jan 02 Javascript
Node.js readline模块与util模块的使用
Mar 01 Javascript
Vue多系统切换实现方案
Jun 05 Javascript
JavaScript实现轮播图效果
Oct 30 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
PHP中的按位与和按位或操作示例
2014/01/27 PHP
在Win7 中为php扩展配置Xcache
2014/10/08 PHP
PHP生成网站桌面快捷方式代码分享
2014/10/11 PHP
JavaScript修改css样式style
2008/04/15 Javascript
js实现YouKu的漂亮搜索框效果
2015/08/19 Javascript
JavaScript中原型链存在的问题解析
2016/09/25 Javascript
JavaScript随机生成颜色的方法
2016/10/15 Javascript
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
2018/11/21 Javascript
详解vue在项目中使用百度地图
2019/03/26 Javascript
手把手教你 CKEDITOR 4 实现Dialog 内嵌 IFrame操作详解
2019/06/18 Javascript
layer 关闭指定弹出层的例子
2019/09/25 Javascript
jQuery实现倒计时功能完整示例
2020/06/01 jQuery
[14:24]Optic Gaming vs PSG LGD BO3
2018/06/07 DOTA
[55:54]FNATIC vs EG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
[34:47]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第一场 11.18
2020/11/18 DOTA
python cx_Oracle的基础使用方法(连接和增删改查)
2017/11/19 Python
使用python实现knn算法
2017/12/20 Python
DataFrame 将某列数据转为数组的方法
2018/04/13 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
python判断字符串或者集合是否为空的实例
2019/01/23 Python
Python实现合并excel表格的方法分析
2019/04/13 Python
Python字典深浅拷贝与循环方式方法详解
2020/02/09 Python
python多项式拟合之np.polyfit 和 np.polyld详解
2020/02/18 Python
css3实现一款模仿iphone样式的注册表单
2013/03/20 HTML / CSS
Html5之svg可缩放矢量图形_动力节点Java学院整理
2017/07/17 HTML / CSS
深入理解HTML5定时器requestAnimationFrame的使用
2018/12/12 HTML / CSS
英国著名的药妆网站:Escentual
2016/07/29 全球购物
ProForm英国站点:健身房和健身器材网上商店
2019/06/05 全球购物
thinkphp5 redis缓存新增方法实例讲解
2021/03/24 PHP
元旦晚会策划方案
2014/02/18 职场文书
三方协议书范本
2014/04/22 职场文书
中班下学期个人总结
2015/02/12 职场文书
Python还能这么玩之用Python修改了班花的开机密码
2021/06/04 Python
《乙女游戏世界对路人角色很不友好》OP主题曲无字幕动画MV公开
2022/04/05 日漫
2022新作动画《福星小子》释出宣传影片 加入内田真礼&宫野真守配音演出
2022/04/08 日漫
xhunter1.sys可以删除嘛? win11提示xhunter1.sys驱动不兼容解决办法
2022/09/23 数码科技