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 相关文章推荐
让ie运行js时提示允许阻止内容运行的解决方法
Oct 24 Javascript
10分钟学会写Jquery插件实例教程
Sep 06 Javascript
Jquery动态添加输入框的方法
May 29 Javascript
浅谈javascript原型链与继承
Jul 13 Javascript
javascript实现tab切换的四种方法
Nov 05 Javascript
JS 实现可停顿的垂直滚动实例代码
Nov 23 Javascript
完美解决UI-Grid表格元素中多个空格显示为一个空格的问题
Apr 25 Javascript
EasyUI实现下拉框多选功能
Nov 07 Javascript
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴的方法
Sep 05 Javascript
用element的upload组件实现多图片上传和压缩的示例代码
Feb 12 Javascript
Nuxt页面级缓存的实现
Mar 09 Javascript
js闭包和垃圾回收机制示例详解
Mar 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
php IP转换整形(ip2long)的详解
2013/06/06 PHP
CodeIgniter框架验证码类库文件与用法示例
2017/03/18 PHP
Laravel中七个非常有用但很少人知道的Carbon方法
2017/09/21 PHP
jquery异步循环获取功能实现代码
2010/09/19 Javascript
杨氏矩阵查找的JS代码
2013/03/21 Javascript
jquery的ajax跨域请求原理和示例
2014/05/08 Javascript
js调试系列 源码定位与调试[基础篇]
2014/06/18 Javascript
JavaScript实现的使用键盘控制人物走动实例
2014/08/27 Javascript
简单谈谈jQuery(function(){})与(function(){})(jQuery)
2014/12/19 Javascript
jQuery在ul中显示某个li索引号的方法
2015/03/17 Javascript
浅谈jquery中delegate()与live()
2015/06/22 Javascript
在ASP.NET MVC项目中使用RequireJS库的用法示例
2016/02/15 Javascript
详解vue-router基本使用
2017/04/18 Javascript
详解Node.js串行化流程控制
2017/05/04 Javascript
基于jQuery解决ios10以上版本缩放问题
2017/11/03 jQuery
微信小程序全选多选效果实现代码解析
2020/01/21 Javascript
vant 解决tab切换插件标题样式自定义的问题
2020/11/13 Javascript
[52:40]完美世界DOTA2联赛PWL S2 Magma vs GXR 第一场 11.29
2020/12/02 DOTA
使用go和python递归删除.ds store文件的方法
2014/01/22 Python
Python实现的建造者模式示例
2018/08/06 Python
python实现五子棋小游戏
2020/03/25 Python
用python一行代码得到数组中某个元素的个数方法
2019/01/28 Python
如何在Django中使用聚合的实现示例
2020/03/23 Python
解决json中ensure_ascii=False的问题
2020/04/03 Python
Python自定义聚合函数merge与transform区别详解
2020/05/26 Python
巴西婴儿用品商店:Bebe Store
2017/11/23 全球购物
介绍一下ICMP(Internet Control Message Protocol)Internet控制信息协议
2016/11/26 面试题
大学生职业规划书的范本
2014/02/18 职场文书
2014年创卫实施方案
2014/02/18 职场文书
信用卡工资证明范本
2014/10/17 职场文书
单位考核鉴定意见
2015/06/05 职场文书
股权投资协议书
2016/03/23 职场文书
python 实现图与图之间的间距调整subplots_adjust
2021/05/21 Python
SQL实现LeetCode(177.第N高薪水)
2021/08/04 MySQL
Vue OpenLayer 为地图绘制风场效果
2022/04/24 Vue.js
Android Gradle 插件自定义Plugin实现注意事项
2022/06/16 Java/Android