JavaScript 笔记(7) -- 在HTML中嵌入 js (外部引用)
本节主要说明,在HTML中嵌入自定义 JavaScript。通过HTML的script标签加载JavaScript文件
- 为防止网页加载缓慢,也可以把非关键的JavaScript放到网页底部,例如下面的代码。
<script type="text/javascript" src="dreamdu.js"></script>
</body>
</html>通常JavaScript文件可以使用script标签加载到网页的任何一个地方,但是标准的方式是加载在head标签内。
- JavaScript文件可以包含任何的JavaScript代码,比如dreamdu.js文件中
document.write("www.dreamdu.com");
document.write("梦之都");
function jsTest(){
/* 该函数可以在 其他的 JS 文件中直接访问;
访问方式与定义在同个文件中的访问方式相同,eg:jsTest();
但需记得在其他 JS 引用时,必须将该文件放在引用它的文件前面。比如:dreamdu2.js 中使用了dreamdu.js 中的 jsTest() 函数,则必须先加载 dreamdu.js(放上面),后加载 dreamdu2.js(放下面)*/
alert("测试自定义 JS 的 function 部分");
console.log("测试自定义 JS 的 function 部分");
} JavaScript文件外部加载的好处
- 避免使用
<!-- ... //-->
,骇客技术。 - 避免使用CDATA。
- 统一定义JavaScript代码,方便查看,方便维护。
- 使代码更安全,可以压缩,加密单个JavaScript文件。
- 浏览器可以缓存JavaScript文件,减少宽带使用(当多个页面同时使用一个JavaScript文件的时候,通常只需下载一次)。
- 避免使用
JavaScript文件外部加载的注意事项
- 不要把JavaScript分为多个文件,多个文件会增加服务器的负担,增加服务器的HTTP请求。
- 一个JavaScript文件也会增大HTTP请求。
- 为什么有些网站的JavaScript文件后面有一串数字?比如:
<scripttype="text/javascript"src="dreamdu.js?1217128319"></script>
有两种可能:
- JavaScript文件更新后,此版本将增加或改变,浏览器会因此判断这是一个新的JavaScript文件,从而更新缓存中以前的JavaScript文件。
- 这个JavaScript文件是由应用程序生成的因此带有版本,便于管理。
JavaScript 笔记(7) -- 在HTML中嵌入 js (外部引用)的更多相关文章
- JavaScript:学习笔记(1)——在HTML中使用JS
在HTML中使用JavaScript <script>元素 1.直接在网页中嵌入JS代码 说明: 请不要在代码的任何地方出现</script>字符串 这是由于解析嵌入式代码的规 ...
- JavaScript笔记01——数据存储(包括.js文件的引用)
While, generally speaking, HTML is for content and CSS is for presentation, JavaScript is for intera ...
- 怎样在网页中嵌入JS代码
有四种方法: 方法1: 在<script>标签内直接写代码 <body> <button id="btn">click</button&g ...
- 《JavaScript高级程序设计》笔记:在HTML中使用Javascript(二)
script元素 向html页面中插入js的主要方法就是使用<script>元素.使用<script>元素的方式有两种:直接在页面中嵌入js代码和包含外部js文件.直接在页面中 ...
- 从头开始学JavaScript 笔记(一)——基础中的基础
原文:从头开始学JavaScript 笔记(一)--基础中的基础 概要:javascript的组成. 各个组成部分的作用 . 一.javascript的组成 javascript ECMASc ...
- 使用CKplayer插件在网页中嵌入视频的方法(常用笔记2)
在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记3
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] JavaScript.jQuer ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记2
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] JavaScript.jQuer ...
- 学习 JavaScript(二)在 HTML 中使用 JS
基本用法 在 HTML 中使用 <script> 元素引入 Javascript , <script> 有以下 4 个常用属性: async: 异步加载,只对外部脚步有效. d ...
随机推荐
- CSS的垂直居中和水平居中总结
内联元素居中方案 水平居中设置: 行内元素 设置 text-align:center: Flex布局 设置display:flex;justify-content:center;(灵活运用) 垂直居中 ...
- PAT 乙级 1003
题目 题目地址:PAT 乙级 1003 题解 规律观察题,本题的关键在于把题读懂,同时还有几个比较容易疏忽的地方需要注意:总之这道题要考虑的东西更多,细节上也要特别注意: 规律:“如果 aPbTc 是 ...
- spring data事务
事务在spring data中的使用 1:事务一般在service层.因为一个service方法可能会多次调用不同的dao,为了保证事务的完整性,那么多次的dao都放到一个方法里面 2:读的时候可以不 ...
- 【JAVA】JVM常用工具
JDK内置工具使用 jps(Java Virtual Machine Process Status Tool) 查看所有的jvm进程,包括进程ID,进程启动的路径等等. jstack(Java ...
- 网站动态加载JS脚本
Demo_1 function loadJS(url, fn) { var ss = document.getElementsByName('script'), loaded = false; for ...
- atm-interface-shopping
from db import db_handlerfrom interface import bank def shopping_interface(name, cost, shoppingcart) ...
- 关于web.xml配置中的<url-pattern>
标签<url-pattern> <url-pattern>是我们用Servlet做Web项目时需要经常配置的标签,例: <servlet><servlet-n ...
- Patrick and Shopping
Patrick and Shopping 今天 Patrick 等待着他的朋友 Spongebob 来他家玩.为了迎接 Spongebob,Patrick 需要去他家附近的两家商店 买一些吃的.他家 ...
- windows下pip安装python模块时报错【转】
windows下pip安装python模块时报错总结 请给作者点赞--> 原文链接 1 权限问题 C:\Users\ljf>pip install xlwt Exception: Trac ...
- Markdowm语法学习
Markdowm语法学习 标题 一级标题 一级标题 #一级标题 二级标题 二级标题 ##二级标题 六级标题 六级标题 ######六级标题 引用 引用 >引用 代码块 if(i == 0) { ...