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 相关文章推荐
在chrome中window.onload事件的一些问题
Mar 01 Javascript
jquery 仿QQ校友的DIV模拟窗口效果源码
Mar 24 Javascript
jQuery实现form表单reset按钮重置清空表单功能
Dec 18 Javascript
在JavaScript中typeof的用途介绍
Apr 11 Javascript
关于jQuery新的事件绑定机制on()的使用技巧
Apr 26 Javascript
JavaScript节点及列表操作实例小结
Aug 05 Javascript
javascript实现网站加入收藏功能
Dec 16 Javascript
Vue 使用中的小技巧
Apr 26 Javascript
vue全局自定义指令-元素拖拽的实现代码
Apr 14 Javascript
Layui 数据表格批量删除和多条件搜索的实例
Sep 04 Javascript
微信小程序引入VANT组件的方法步骤
Sep 19 Javascript
如何利用JavaScript实现二叉搜索树
Apr 02 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 配置open_basedir 让各虚拟站点独立运行
2009/11/12 PHP
PHP session会话的安全性分析
2011/09/08 PHP
PHP判断指定时间段的2个方法
2014/03/14 PHP
java script编程起步(第三课)
2007/01/10 Javascript
JS时间选择器 兼容IE6,7,8,9
2012/06/26 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
2013/04/02 Javascript
JS 实现图片直接下载示例代码
2013/07/22 Javascript
js 时间格式与时间戳的相互转换示例代码
2013/12/25 Javascript
jQuery取得设置清空select选择的文本与值
2014/07/08 Javascript
解决Jquery向页面append新元素之后事件的绑定问题
2015/03/16 Javascript
JavaScript数据类型学习笔记
2016/01/25 Javascript
js控制台输出的方法(详解)
2016/11/26 Javascript
jQuery控制控件文本的长度的操作方法
2016/12/05 Javascript
使用AngularJS 跨站请求如何解决jsonp请求问题
2017/01/16 Javascript
nodejs制作爬虫实现批量下载图片
2017/05/19 NodeJs
详解基于Angular4+ server render(服务端渲染)开发教程
2017/08/28 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
2017/12/16 Javascript
vue实现文字横向无缝走马灯组件效果的实例代码
2019/04/09 Javascript
微信小程序实现多选框全选与取消全选功能示例
2019/05/14 Javascript
防止Layui form表单重复提交的实现方法
2019/09/10 Javascript
wxpython 学习笔记 第一天
2009/02/09 Python
Python去掉字符串中空格的方法
2014/03/11 Python
用Python进行基础的函数式编程的教程
2015/03/31 Python
详解Python最长公共子串和最长公共子序列的实现
2018/07/07 Python
台湾百利市购物中心:e-Payless
2017/08/16 全球购物
新西兰领先的鞋类和靴子网上商城:Merchant 1948
2017/09/08 全球购物
Blancsom美国/加拿大:服装和生活用品供应商
2018/07/27 全球购物
毕业生个人求职信范文分享
2014/01/05 职场文书
毕业班联欢会主持词
2014/03/27 职场文书
关于拾金不昧的感谢信
2015/01/21 职场文书
房产销售员2015年终工作总结
2015/10/22 职场文书
Python绘制地图神器folium的新人入门指南
2021/05/23 Python
Vue中foreach数组与js中遍历数组的写法说明
2021/06/05 Vue.js
Redis缓存-序列化对象存储乱码问题的解决
2021/06/21 Redis
JavaScript组合继承详解
2021/11/07 Javascript
Windows11性能真的上涨35%? 桌面酷睿i9实测结果公开
2021/11/21 数码科技