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截取中文字符串的实现代码
Dec 22 Javascript
节点的插入之append()和appendTo()的用法介绍
Jan 13 Javascript
jQuery实用函数用法总结
Aug 29 Javascript
$(&quot;&quot;).click与onclick的区别示例介绍
Sep 25 Javascript
jsMind通过鼠标拖拽的方式调整节点位置
Apr 13 Javascript
javascript鼠标右键菜单自定义效果
Dec 08 Javascript
浅谈js中的this问题
Aug 31 Javascript
vue弹窗组件使用方法
Apr 28 Javascript
搭建一个Koa后端项目脚手架的方法步骤
May 30 Javascript
如何通过javaScript去除字符串两端的空白字符
Feb 06 Javascript
jQuery+css实现的点击图片放大缩小预览功能示例【图片预览 查看大图】
May 29 jQuery
javascript中call,apply,bind的区别详解
Dec 11 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
怎样在UNIX系统下安装MySQL
2006/10/09 PHP
Smarty的配置与高级缓存技术分享
2012/06/05 PHP
ThinkPHP CURD方法之page方法详解
2014/06/18 PHP
PHP实现的蚂蚁爬杆路径算法代码
2015/12/03 PHP
thinkPHP框架实现的无限回复评论功能示例
2018/06/09 PHP
验证手机号码的JS方法分享
2013/09/10 Javascript
浅谈JSON中stringify 函数、toJosn函数和parse函数
2015/01/26 Javascript
详解AngularJS中的filter过滤器用法
2016/01/04 Javascript
Angular 中 select指令用法详解
2016/09/29 Javascript
手机软键盘弹出时影响布局的解决方法
2016/12/15 Javascript
js 颜色选择插件
2017/01/23 Javascript
Bootstrap Table使用整理(一)
2017/06/09 Javascript
Angularjs单选框相关的示例代码
2017/08/17 Javascript
详解Vue内部怎样处理props选项的多种写法
2018/11/06 Javascript
js实现二级联动简单实例
2020/01/11 Javascript
[02:18]DOTA2英雄基础教程 育母蜘蛛
2014/01/20 DOTA
[44:58]2018DOTA2亚洲邀请赛 4.5 淘汰赛 LGD vs Liquid 第二场
2018/04/06 DOTA
Python提示[Errno 32]Broken pipe导致线程crash错误解决方法
2014/11/19 Python
Python中类型检查的详细介绍
2017/02/13 Python
使用python实现接口的方法
2017/07/07 Python
python判断数字是否是超级素数幂
2018/09/27 Python
解决安装python库时windows error5 报错的问题
2018/10/21 Python
cProfile Python性能分析工具使用详解
2019/07/22 Python
python+opencv实现移动侦测(帧差法)
2020/03/20 Python
python 实现简单的计算器(gui界面)
2020/11/11 Python
HTML5 canvas基本绘图之文字渲染
2016/06/27 HTML / CSS
FILA斐乐中国官方商城:意大利运动品牌
2017/01/25 全球购物
Lands’ End英国官方网站:高质量男女服装
2017/10/07 全球购物
英语文学专业学生的自我评价
2013/10/31 职场文书
借款协议书
2014/04/12 职场文书
中国在我心中演讲稿
2014/09/13 职场文书
2014年保卫工作总结
2014/12/05 职场文书
团员个人年度总结
2015/02/26 职场文书
公司财务管理制度
2015/08/04 职场文书
《鲁滨逊漂流记》之六读后感(4篇)
2019/09/29 职场文书
使用 CSS 轻松实现一些高频出现的奇形怪状按钮
2021/12/06 HTML / CSS