js 高级三 基础篇 (一)

还不容易 开篇了,本来不知道写点啥还是 记录 一下自己发现的亮点 :

1,  建议把全部引入的javascript 放在</body> 结尾 的前面

2, <script> 的defer (延期) 与 html5 的 async (异步)

  defer: 在外部js 加入defer = "defer" 例如: <script type="text/javascript" src="jquery-1.8.3.min.js" defer = "defer"></script>   脚本会延迟到整个页面解析完成再加载  但在现实中延迟脚本 不一定会按照它们出现是顺序呢加载 也不一定在DomContentLoaded 前加载:最好只包含一个延迟脚本 htm5 忽略 给嵌入式脚本设置 defer 的属性 ; ie8 >= 完全支持 htm5规定的行为

async :设置 async = "async" 这个属性和defer类似 但与defer不同的是,标记 async的脚本不能保证按照指定的先后顺序执行。async 一定会在load事件前执行,但可能在DomContentLoaded事件之前或者之后执行。

一般情况下,DOMContentLoaded事件要在window.onload之前执行,当DOM树构建完成的时候就会执行DOMContentLoaded事件,而window.onload是在页面载入完成的时候,才执行,这其中包括图片等元素。大多数时候我们只是想在DOM树构建完成后,绑定事件到元素,我们并不需要图片元素,加上有时候加载外域图片的速度非常缓慢。

3,在xhtml 中的用法 : 与HTML不一样,XHTML对大小写是敏感的,<title>和<TITLE>是不同的标签。XHTML要求所有的标签和属性的名字都必须使用小写。


<script type="text/javascript">

  function compare(a, b){
        if(a < b){
                return ‘a 小于b‘;
            }else if(a>b){
                return ‘a 大于 b‘;
            }else{       
            return ‘a == b‘
            }
        }

    </script>
  在html中这些规则是被解析的,但在xhtml是不被解析的这里语句中a<b中的小于号在xhtml 当做一个新标签来解析的但作为标签来讲 小于号后面是不能跟空格的,因此导致语法错误。两种解决方法:1是用html相应的(&lt;)替换代码中出现的所有的小于号( < ) 

  代码如下:

  

  <script type="text/javascript">
        function compare(a, b){
            if(a &lt; b){
                return ‘a 小于b‘;
            }else if(a>b){
                return ‘a 大于 b‘;
            }else{       
            return ‘a == b‘
            }
        }
    </script>这样是可以用 导致无法理解,CData片段来包含javascript代码;在xhtml 与xml 中 CData 片段是文档中的一个特殊区域;引入 CData 片段如下:
<script type="text/javascript">
        function compare(a, b){
            <![CDATA[
                if(a < b){
                    return ‘a 小于b‘;
                }else if(a>b){
                    return ‘a 大于 b‘;
                }else{       
                return ‘a == b‘
                }
                }
            ]]>
            // 还有的是不支持     CDATA片段的 则把CDATA的标记注释掉
            function compare(a, b){
            <![CDATA[
                if(a < b){
                    return ‘a 小于b‘;
                }else if(a>b){
                    return ‘a 大于 b‘;
                }else{       
                return ‘a == b‘
                }
                }
            ]]>
    </script>

4

<noscript>
  对于不支持的js显示
</noscript>

时间: 2024-10-11 05:09:49

js 高级三 基础篇 (一)的相关文章

php面试题汇总三(基础篇附答案)

问题 1. 如何访问会话变量(session)? A.通过$_GET B.通过$_POST C.通过$_REQUEST D.通过全局变量 E.以上都不对 2. 哪个函数能让服务器输出如下 header? set-Cookie: foo=bar; 答案:_______________ 3. 在忽略浏览器 bug 的正常情况下,如何用一个与先前设置的域名(domain)不同的新 域名来访问某个 cookie? A.通过 HTTP_REMOTE_COOKIE 访问 B.不可能 C.在调用 setcoo

JS服务器端开发基础篇(Array.slice方法)

Array.slice方法在众多的JS数组中属于比较复杂的一个方法,搜索网络上很多资料都没有发现系统的总结.特别归纳如下,不完全处还希望各位批评指正. 格式: arrayObj.slice(start, [end]) 功能:返回指定数组的一个子数组,并不修改原来数组. 参数: start:必需.arrayObj的指定部分的开头. end:可选.arrayObj的指定部分的结尾. 数组使用来看,这个方法类似于串操作中的substr函数.但是,当参数为负数时,情况就复杂了. 具体情况详见下面的代码示

JS之prototype基础篇

function HiClass() { this.sayHi = function(){ alert("hi"); } } var obj = new HiClass();  alert(HiClass.prototype);//outputs [object, object] alert(obj.prototype);//outputs undefined 在用prototype的方式实现继承一个类的时候,要注意其可能覆盖别的prototype方式添加的属性和方法.如果是HiCla

JS高级(三)--原型链、闭包、作用域、函数的四种调用方式

一.原型链(家族族谱) 概念:JS里面的对象可能会有父对象,父对象还会有父对象,.....祖先 根本:继承 属性:对象中几乎都会有一个__proto__属性,指向他的父对象 意义:可以实现让该对象访问到父对象中相关属性 根对象:Object.prototype var arr=[1,3,5] arr.__proto__:Array.prototype arr.__proto__.__proto__就是找到了根对象 function Animal(){} var cat=new Animal();

chrome调试工具高级不完整使用指南(基础篇)

一.前言 本文记录的是作者在工作上面对chrome的一些使用和情况的分析分享,内容仅代表个人的观点.转发请注明出处(http://www.cnblogs.com/st-leslie/),谢谢合作 二.浏览器模块介绍 由于chrome浏览器一直在不断的进行更新迭代,会不断的新增功能,有一些老的功能会被摒弃掉,所以我们介绍这个功能的时候是以这个系列文章发布时候的最新版为主(2018-01-05 ) 1. 用来选择所需要的HTML元素,通过HTML元素定位到Elements中的对应代码 2. 用来在手

js调试系列: 源码定位与调试[基础篇]

js调试系列目录: - 如果看了1, 2两篇,你对控制台应该有一个初步了解了,今天我们来个简单的调试.昨天留的三个课后练习,差不多就是今天要讲的内容.我们先来处理第一个问题:1. 查看文章下方 推荐 这个功能所调用的函数源码其实非常简单,点放大镜选中那个推荐即可.这个  votePost(cb_entryId,'Digg')  就是推荐按钮所调用的函数了,是不是非常简单. 第二个问题,定位到函数所在文件位置.其实也是非常简单的,当然,不熟悉控制台的朋友也许不知道怎么看.我在控制台输入 voteP

js调试系列:断点和动态调试[基础篇]

js调试系列: 断点与动态调试[基础篇] js调试系列目录: - js调试系列: 初识控制台 js调试系列: 控制台命令行API js调试系列: 源码定位与调试[基础篇] js调试系列: 断点与动态调试[基础篇] js调试系列: 调试基础与技巧 额,我说的不是张敬轩的 断点 这首歌,是调试用到的断点,进入正题吧. 昨天留的课后练习 1. 分析 votePost 函数是如何实现 推荐 的.其实我们已经看到了源码,只要读下源码即可知道他是怎么实现的了. 文本 function votePost(n,

js调试系列: 断点与动态调试[基础篇]

js调试系列目录: - 额,我说的不是张敬轩的 断点 这首歌,是调试用到的断点,进入正题吧. 昨天留的课后练习 1. 分析 votePost 函数是如何实现 推荐 的.其实我们已经看到了源码,只要读下源码即可知道他是怎么实现的了. function votePost(n, t, i) { i || (i = !1); var r = { blogApp: currentBlogApp, postId: n, voteType: t, isAbandoned: i }; $("#digg_tips

Arduino 高级教程 01:基础篇

我与 Arduino,以及为什么要写这个系列的文章 Arduino 这个已经火了好多年了,早就不是什么新鲜的技术.如果有人还不清楚 Arduino 是个什么东西,对不起,请自行搜索,随便翻开哪个维基百科的介绍或者爱好者写的系列文章,人家介绍得都比我更清楚更全面.恕我不在这里赘述了. 最早接触 Arduino 是在 2008年,那时候我对嵌入式开发一窍不通,刚刚开始学习单片机,就是在那时候注意到了 Arduino,它确实能够让我快速地在 8 位 AVR 单片机上跑点简单的小程序,颇有点小小的成就感