使用<script>元素的方式

外部引用式、行内式、嵌入式。

  JavaScript引用放在<body>后面的原因

假如在文档的<head>元素中包含所有JavaScript文件,意味着必须等到全部JavaScript代码都被下载、解析和执行完成以后,才能开始呈现页面的内容。对于那些需要很多JavaScript代码的页面来说,这无疑会导致浏览器在呈现页面时出现明显的延迟,而延迟期间的浏览器窗口中将是一片空白。

  JavaScript在XHTML中的用法

XHTML是一种可扩展超文本标记语言,是将HTML作为XML的应用而重新定义的一个标准。编写XHTML代码的规则要比编写HTML严格的多,而且直接影响能否在嵌入JavaScript代码时使用<script>标签。以下代码块在HTML中是有效的,但在XHTML中则无效,因为在XHTML中小于号(<)将被当做开始一个新标签来解析,作为标签来讲,小于号后面不能跟空格。

解决方法一:用相应的HTML实体(&lt;)替换代码中所有的小于号

解决方法二:用一个CData片段来包含JavaScript代码。在XHTML中,CData片段是文档中的一个特殊区域,这个区域中可以包含不需要解析的任意格式的文本内容。

  HTML文档模式

通过使用文档类型DOCTYPE来指定,目前文档模式有三种:混杂模式、标准模式和准标准模式。

  延迟脚本

HTML为<script>标签定义了defer属性。这个属性的用途是表明脚本在执行时不会影响页面的构造。也就是说,脚本会被延迟到整个页面都解析完毕后再运行。因此,在<script>元素中设置defer属性,相当于告诉浏览器立即下载,但延迟执行。

  异步脚本

HTML5为<script>元素定义了async属性。这个属性与defer属性类似,都用于改变处理脚本的行为。同样与defer类似,async只适用于外部脚本文件,并告诉浏览器立即下载文件。但与defer不同的是,标记为async的脚本并不保证按照指定它们的先后顺序执行。

  <noscript>元素

可以指定在不支持脚本的浏览器中显示的替代内容。但在启用了脚本的情况下,浏览器不会显示<noscript>元素中的任何内容。

  延伸:Hack技术

由于不同的浏览器,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够兼容不同的浏览器,能在不同的浏览器中也能够得到我们想要的页面效果。这个针对不同的浏览器写不同的CSS code的过程,就叫CSS hack,也叫写CSS hack。

JS高级程序设计第三版——在HTML中使用JavaScript的更多相关文章

  1. JS高级程序设计第三版——JavaScript简介

    JavaScript简史 JavaScript由Netscape(网景)公司在1995年发布,最开始的主要目的是处理以前由服务器端语言负责的一些输入验证操作,以便提高用户体验,后来就慢慢的发展为一门强 ...

  2. JS高级程序设计第三版——变量、作用域和内存问题

    JavaScript变量: 由于JavaScript变量松散类型的本质,决定了它只是在特定时间用于保存特定值的一个名字而已.由于不存在定义某个变量必须要保存何种数据类型值的规则,变量的值及其数据类型可 ...

  3. JS高级程序设计第三版——基本概念

    前言:任何语言的核心都必然会描述这门语言最基本的工作原理.而描述的内容通常都要设计这门语言的语法.操作符.数据类型.内置功能等用于构建复杂解决方案的基本概念. 语法: 1.  区分大小写: 2.  标 ...

  4. JavaScript高级程序设计第三版.CHM【带实例】

    从驱动全球商业.贸易及管理领域不计其数的复杂应用程序的角度来看,说 JavaScript 已经成为当今世界上最流行的编程语言一点儿都不为过. JavaScript 是一种非常松散的面向对象语言,也是 ...

  5. javascript高级程序设计第三版书摘

    在HTML 中使用JavaScript <script>元素 在使用<script>元素嵌入 JavaScript 代码时,只须为<script>指定 type 属 ...

  6. JavaScript高级程序设计第三版-读书笔记(1-3章)

    这是我第一次用markdown,也是我第一次在网上记录我自己的学习过程. 第一章 JavaScript主要由以下三个不同的部分构成 ECMAScript   提供核心语言功能 DOM     提供访问 ...

  7. DOM 操作技术【JavaScript高级程序设计第三版】

    很多时候,DOM 操作都比较简明,因此用JavaScript 生成那些通常原本是用HTML 代码生成的内容并不麻烦.不过,也有一些时候,操作DOM 并不像表面上看起来那么简单.由于浏览器中充斥着隐藏的 ...

  8. 10.2 DOM 操作技术【JavaScript高级程序设计第三版】

    很多时候,DOM 操作都比较简明,因此用JavaScript 生成那些通常原本是用HTML 代码生成的内容并不麻烦.不过,也有一些时候,操作DOM 并不像表面上看起来那么简单.由于浏览器中充斥着隐藏的 ...

  9. 2.1 <script>元素【JavaScript高级程序设计第三版】

    向 HTML 页面中插入 JavaScript 的主要方法,就是使用<script>元素.这个元素由 Netscape 创造并在 Netscape Navigator 2 中首先实现.后来 ...

随机推荐

  1. Optimizing and caching browser bundles...

    扎心了,老铁!!! 他妈的,弄了几天都是卡在这里!!上网查了一下.说是我的内存不够,好吧.我慢慢等,然而让我等了好几天都没什么反应..两天了,一直卡在这里.今天在虚拟机也是发狠了. 我直接把虚拟机的内 ...

  2. sublime text3 添加新片段

    1.tools->developer->new snippet 要介绍一下snippet四个组成部分: content:其中必须包含<![CDATA[…]]>,否则无法工作, ...

  3. 011 Android TabLayout+ViewPager实现顶部滑动效果(多个页面)

    1.TabLayout介绍 TabLayout提供了一个水平的布局用来展示Tabs,很多应用都有这样的设计,典型的有网易新闻,简书,知乎等.TabLayout就可以很好的完成这一职责,首先TabLay ...

  4. Python爬虫常用之PyQuery

    PyQuery是解析页面常用的库.是python对jquery的封装.下面是一份解析基本页面的代码.后期用到复杂或者实用的方式再增加. from pyquery import PyQuery as p ...

  5. PIE SDK元素的保存与打开

    1.功能简介 绘制元素之后需要对元素进一步的保存操作,可以利用PIE SDK的ExportElementsCommand命令保存成xml格式的文件,打开元素可以利用ImportElementsComm ...

  6. CAPL编程实现诊断刷写,车联网FOTA流程自动化测试(代码篇)

    原创内容,转载请注明出处   接上篇,本文主要讲CAPL编程详细实现,软件环境CANoe  11.0 一.Simulation Setup 1.建模之前,首先创建一个.DBC文件.如果不会,可以用一个 ...

  7. 写给初学者的话---linux使用说明

    2018年noip上海赛区可以使用window操作系统的美梦终究还是破灭了!!!!上海大部分noip选手都陆陆续续开始改linux........好吧,那我们今天来看看linux操作系统中,noip选 ...

  8. 设置IIS允许下载.config文件

    <configuration> <system.webServer>        <security>            <requestFilteri ...

  9. JavaScript设计模式(二) - 单例模式

    什么是单例模式? 单例模式从字面上的理解是不困难的,js上就是指只有一个对象实例. 为什么需要单例模式? 我们可以将一些成员变量封装在一个单例对象中,每次访问这些变量都只能从这个单例对象进行访问,这样 ...

  10. CSS布局——左定宽度右自适应宽度并且等高布局

    方法一: 别的不多说,直接上代码,或者参考在线DEMO,下面所有的DEMO都有HTML和CSS代码,感兴趣的同学自己慢慢看吧. HTML Markup <div id="contain ...