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 相关文章推荐
XRegExp 0.2: Now With Named Capture
Nov 30 Javascript
javascript 实用的文字链提示框效果
Jun 30 Javascript
利用javascript判断文件是否存在
Dec 31 Javascript
jquerymobile局部渲染的各种刷新方法小结
Mar 05 Javascript
对之前写的jquery分页做下升级
Jun 19 Javascript
JS实现模拟百度搜索“2012世界末日”网页地震撕裂效果代码
Oct 31 Javascript
JavaScript 栈的详解及实例代码
Jan 22 Javascript
jQuery+ajax实现修改密码验证功能实例详解
Jul 06 jQuery
jquery实现点击a链接,跳转之后,该a链接处显示背景色的方法
Jan 18 jQuery
js合并两个数组生成合并后的key:value数组
May 09 Javascript
vue 中固定导航栏的实例代码
Nov 01 Javascript
JS实现纵向轮播图(初级版)
Jan 18 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
漫威DC御用漫画家去世 他的表情包曾走红网络
2020/04/09 欧美动漫
自制汽车收音机天线:收听广播的技巧和方法
2021/03/02 无线电
PHP实现图片防盗链破解操作示例【解决图片防盗链问题/反向代理】
2020/05/29 PHP
Ext 今日学习总结
2010/09/19 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
2013/08/02 Javascript
javascript定义变量时有var和没有var的区别探讨
2014/07/21 Javascript
微信JS-SDK坐标位置如何转换为百度地图坐标
2016/07/04 Javascript
javaScript事件机制兼容【详细整理】
2016/07/23 Javascript
用Angular实时获取本地Localstorage数据,实现一个模拟后台数据登入的效果
2016/11/09 Javascript
利用fecha进行JS日期处理
2016/11/21 Javascript
从零开始学习Node.js系列教程之基于connect和express框架的多页面实现数学运算示例
2017/04/13 Javascript
使用vue实现简单键盘的示例(支持移动端和pc端)
2017/12/25 Javascript
微信小程序实现通过js操作wxml的wxss属性示例
2018/12/06 Javascript
JavaScript禁用右键单击优缺点分析
2019/01/20 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
2019/02/22 Javascript
[58:00]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant BO3 第二场 2月7日
2021/03/11 DOTA
详细介绍Python函数中的默认参数
2015/03/30 Python
简介Python中用于处理字符串的center()方法
2015/05/18 Python
Python实现求一个集合所有子集的示例
2018/05/04 Python
Scrapy使用的基本流程与实例讲解
2018/10/21 Python
python 处理微信对账单数据的实例代码
2019/07/19 Python
python函数的万能参数传参详解
2019/07/26 Python
基于python 凸包问题的解决
2020/04/16 Python
python 实现分组求和与分组累加求和代码
2020/05/18 Python
SQL Server数据库笔试题和答案
2016/02/04 面试题
轻金属冶金专业毕业生自荐信
2013/11/02 职场文书
大学生职业生涯规划书的基本内容
2014/01/06 职场文书
应届优秀本科大学毕业生自我鉴定
2014/01/21 职场文书
信息技术毕业生自荐信范文
2014/03/13 职场文书
毕业留言寄语大全
2014/04/10 职场文书
超越自我演讲稿
2014/05/21 职场文书
四年级小学生评语
2014/12/26 职场文书
摩登时代观后感
2015/06/03 职场文书
网络营销实训总结
2015/08/03 职场文书
2016暑期社会实践心得体会范文
2016/01/14 职场文书
Java字符缓冲流BufferedWriter
2022/04/09 Java/Android