JavaScript_process01
JavaScript_process01
和html使用css一样，使用js也有两种途径，其一为内嵌js代码，其二是外部引用.js文件。
******************************************************************
需要注意的是，带有src属性的<script>元素，即采用外部引用方式，不应该在其<script>和</script>标签之间再包含额外的JavaScript代码。如果包含了嵌入的代码，则只会下载并执行脚本文件，嵌入的代码会被忽略。 另外，通过<script>元素的src属性还可以包含来自外部域的JavaScript文件。这一点既使<script>元素倍显强大，又让它备受争议。位于外部域中的代码也会被加载和解析，就像这些代码位于加载它们的页面中一样。利用这一点就可以在必要时通过不同的域来提供JavaScript文件。不过，在访问自己不能控制的服务器上的JavaScript文件时则要多加小心。考虑到如今网络安全hack事件遍布大街小巷，安全意识一定不能放轻，因此，如果想包含来自不同域的代码，则要么你是那个域的所有者，要么那个域的所有者值得信赖。
******************************************************************
一 标签的位置
传统来说，<script></script>应该位于head内部，虽然规范化了，但针对现在的网页复杂性，会产生很大的延迟，因为在.js加载完全之前Body元素不会得到展现。
所以，现在web应用程序一般都采用把.js放在内容后面，即：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>with a js page</title>
</head>
<body>
頁面內容 ｂｙ ｄｏｒｉｓｗｏｗｏ
<script type="text/javascript" src="js1.js"></script>
<script type="text/javascript" src="js2.js"></script>
</body>
</html>
这样的话页面就会优先加载内容显示，用户体验得到提升~
二.延迟脚本
#使用defer属性，使得在页面加载完全之后，即</body>之后，脚本才执行
#defer属性要求只能用于外部引用脚本，但是IE4~7仍支持内部嵌入脚本，8以后完全支持html5规范
#chrome，firefox，ie4，safari是最早支持该属性的，但还是有些浏览器不支持，所以最好还是放在页底咯~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>with a js page</title>
<script type="text/javascript" defer="defer" src="js1.js"></script>
<script type="text/javascript" defer="defer" src="js2.js"></script>
</head>
<body>
頁面內容
</body>
</html>
*html5要求脚本按照顺序执行，即js1先于js2,但实际中不是很有效，所以为了避免错乱，最好是只设定一个延迟加载
三 异步脚本
#和defer类似，用于改变脚本的执行行为的，但是该属性不保证脚本顺序执行，所以要注意脚本之间的依赖关系
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>with a js page</title>
<script type="text/javascript" async="async" src="js1.js"></script>
<script type="text/javascript" async="async" src="js2.js"></script>
</head>
<body>
頁面內容
</body>
</html>
四 在xhtml,html中注意点
如下代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>with a js page</title>
<script type="text/javascript">
function cmp(a,b){
if(a < b )
alert("a<b啦")
}
</script>
</head>
<body>
頁面內容
</body>
</html>
#在html中可以正常运行，但用于xhtml的特殊严格规则，对于<会解析为一个标签开始，之间不能有空格，会报错误
解决方法为：将a<b改为a<b
五 不推荐使用script时
#若浏览器不支持script元素，则使用html的注释<!-- -->将其<script></script>内注释掉，以免浏览器将其解释为内容而影响页面排版
六 文档格式
#html5之前的文档格式声明都是一大串，我也记不住，但html5写出来就是分分钟的事啦
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>with a js page</title>
</head>
<body>
頁面內容
</body>
</html>
七 浏览器不支持javascript时：noscript
#最后说一个noscript，当浏览器压根不支持javascript，或者脚本被禁用时，采用noscript给用户友好的提示
#当然了，如果不存在上述问题就忽略啦，相当于没有该元素
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>with a js page</title>
</head>
<body>
頁面內容
<noscript>wow~该浏览器不支持javascript，请换个浏览器或者解除脚本禁用选项~</noscript>
</body>
</html>
转载于:https://www.cnblogs.com/doriswowo/p/js01bydoriswowo.html
JavaScript_process01相关推荐
最新文章
- ajax 返回flase,Django request.is_ajax返回false
- linux中端口的欺骗,Linux中的端口占用问题
- 这说明什么？【转载】早点长大的飞秋2013
- 1259：【例9.3】求最长不下降序列
- ROOBO公布A轮1亿美元融资 发布人工智能机器人系统
- Java 使用SAX解析XML文档
- [转]没有找到 MFC42D.DLL，因此这个应用程序未能启动。重新安装应用程序可能会修复此问题。解决方法！...
- 人工智能在教育中的应用，主要包含哪几个方面？
- 那个只能在win7的扫雷游戏，你能通关吗？今天用Python教大家，上号！！！
- linux环境蝉道搭建及关联钉钉
- 第一次使用公有云需要注意啥
- python决策树例题经典案例-决策树python实现小样例
- android恶意积分墙代码,传统积分墙的忧虑：微信积分墙刷榜优化分析
- python判断是否回文_Python语言判断输入的是否是回文数的方法
- 劈荆斩棘：Gitlab 部署 CI 持续集成
- 互联网快讯：极米Z6X Pro、极米H3S音画表现出众；快狗打车赴港IPO；vivo回应造车传闻
- 华为云 ModelArts 应用轻松实现图片识别
- SLAM无人车计算地图坐标,ros中计算地图坐标,rosweb计算画布对应的坐标（含代码，含公式，超详细），开发跨系统地图导航必备算法【可实现qt，android,c#,mfc,html等地图开发】
- 微信公众号 语音录音jssdk
- iOS证书申请打包上传App Store审核完整流程（7个步骤）