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 相关文章推荐
Javascript的getYear、getFullYear、getUTCFullYear异同分享
Nov 30 Javascript
理解和运用JavaScript的闭包机制
Aug 13 Javascript
理解JavaScript事件对象
Jan 25 Javascript
多种JQuery循环滚动文字图片效果代码
Jun 23 Javascript
JavaScript实现99乘法表及隔行变色实例代码
Feb 24 Javascript
DOM中事件处理概览与原理的全面解析
Aug 16 Javascript
微信小程序去哪里找 小程序到底如何使用(附小程序名单)
Jan 09 Javascript
jQuery、zepto、js常用小技巧
Feb 12 Javascript
node通过express搭建自己的服务器
Sep 30 Javascript
vue.js2.0 实现better-scroll的滚动效果实例详解
Aug 13 Javascript
详解Webpack-dev-server的proxy用法
Sep 08 Javascript
JS的时间格式化和时间戳转换函数示例详解
Jul 27 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
Cannot modify header information错误解决方法
2008/10/08 PHP
给初学者的30条PHP最佳实践(荒野无灯)
2011/08/02 PHP
PHP整数取余返回负数的相关解决方法
2014/05/15 PHP
laravel中的一些简单实用功能
2018/11/03 PHP
php 利用socket发送GET,POST请求的实例代码
2020/07/04 PHP
让iframe自适应高度(支持XHTML,支持FF)
2007/07/24 Javascript
IE中createElement需要注意的一个问题
2010/07/13 Javascript
jquery each()源代码
2011/02/14 Javascript
jQuery模拟超链接点击效果代码
2013/04/21 Javascript
jQuery中对未来的元素绑定事件用bind、live or on
2014/04/17 Javascript
javascript实现无缝上下滚动特效
2015/12/16 Javascript
js制作支付倒计时页面
2016/10/21 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
JavaScript hasOwnProperty() 函数实例详解
2017/08/04 Javascript
vue组件中使用props传递数据的实例详解
2018/04/08 Javascript
jQuery超简单遮罩层实现方法示例
2018/09/06 jQuery
ant-design-vue 实现表格内部字段验证功能
2019/12/16 Javascript
JS+CSS实现3D切割轮播图
2020/03/21 Javascript
js抽奖转盘实现方法分析
2020/05/16 Javascript
vue+swiper实现左右滑动的测试题功能
2020/10/30 Javascript
Python机器学习之决策树算法实例详解
2017/12/06 Python
python绘制散点图并标记序号的方法
2018/12/11 Python
python 实现矩阵上下/左右翻转,转置的示例
2019/01/23 Python
tensorflow实现读取模型中保存的值 tf.train.NewCheckpointReader
2020/02/10 Python
构建高效的python requests长连接池详解
2020/05/02 Python
容易被忽略的Python内置类型
2020/09/03 Python
Python实现PS滤镜中的USM锐化效果
2020/12/04 Python
中医药大学市场营销专业自荐信
2013/09/29 职场文书
大学毕业登记表自我鉴定
2013/10/09 职场文书
2014年五一活动策划方案
2014/03/15 职场文书
石油工程专业毕业生求职信
2014/04/13 职场文书
论文指导教师评语
2014/04/28 职场文书
田径运动会通讯稿
2014/09/13 职场文书
2014年社区综治工作总结
2014/11/17 职场文书
投资公司董事长岗位职责
2015/04/16 职场文书
CSS中实现动画效果-附案例
2022/02/28 HTML / CSS