1、异步载入一个js代码
function loadasync(url) {
var head = document.getElementsByTagName("head")[0]; // 找到head节点
var s = document.createElement("script"); // 创建一个script标签
s.src = url; // 设置一个src属性
head.appendChild(s); // 插入标签到head节点中
}
2、事件驱动javascript
2.1 将事件处理函数绑定到目标对象的属性上
window.onload = function(){};//1
var btn = document.getElementById('button');//2
btn.onclick = function(){
....
}
function readS(){
.....
}
request.onreadystatechange = readS();//3
以上三种是比较常见的
2.2、事件绑定方式(事件监听器)
非IE下使用
window.addEventListener('load',function(){},false);
IE下
window.attachEvent('load',function(){});
3、onload文档结构加载完成后执行一个函数
// 注册一个函数用来在文档加载完成时执行
// 如果文档加载完成,异步运行一个函数
function onLoad(f) {
if (onLoad.loaded) // 如果文档已经加载完成
window.setTimeout(f, 0); // 放入队列尽快执行
else if (window.addEventListener) // 绑定事件监听函数
window.addEventListener("load", f, false);
else if (window.attachEvent) //IE8以下执行
window.attachEvent("onload", f);
}
// 设置一个标记位用来确定文档是否加载完成
onLoad.loaded = false;
//注册一个load函数设置加载标记
onLoad(function() { onLoad.loaded = true; });
4、javascript时间线执行顺序
4.1 web浏览器创建document对象,并且开始解析web页面,解析html元素和他们的文本内容后添加element元素和text文本到文档中!
在这个阶段的document.readyState属性的值是loading.
4.2 当html解析器遇到script没有设置async和defer的时候,它把元素添加到文档中,然后执行行内或外部脚本。这些脚本会同步执行,并且在脚本下载和执行时候。解析器会暂停解析。
这样脚本就可以用documen.write()方法将内容插入到页面中。解析器恢复时候这些内容会成为文档中的一部分,
4.3 当html结构设置了script没有设置async的时候,它开始下载脚本文件,并且继续解析文档。脚本会在它下载完成后尽快执行,但是解析器不会停下来等他下载完成。异步脚本禁止使用documen.write()
这种方法。
4.4 当文档解析完成后document.readyState属性的值是interactive.
4.5 所有defer脚本会按照他们在文档中出现的顺序依次执行,这时候异步脚本也可能会在这个时候执行,延迟脚本可以访问完整的文档树结构,禁止使用document.weite()
4.6 浏览器在document上触发DOMContentLoaded事件。这标志着脚本从同步执行变成事件驱动阶段,注意的是这个时候异步脚本可能还会执行。
4.7 这个时候文档结构解析完成,但是浏览器可能还在等待其他内容载入,如图片。当所有这些完成载入的时候并且异步脚本完全载入和执行,document.readyState属性的值是complete.web浏览器触发window对象上的onload事件!
4.8 从此刻起会调用异步事件,以异步响应用户的输入,网络,计时器等!
5、IE条件注释
<!--[if IE 5]>
仅IE5.5可见
<![endif]-->
<!--[if gt IE 5.5]>
仅IE 5.5以上可见
<![endif]-->
<!--[if lt IE 5.5]>
仅IE 5.5以下可见
<![endif]-->
<!--[if gte IE 5.5]>
IE 5.5及以上可见
<![endif]-->
<!--[if lte IE 5.5]>
IE 5.5及以下可见
<![endif]-->
<!--[if !IE 5.5]>
非IE 5.5的IE可见
<![endif]-->
下面的代码是在非IE浏览器下运行的条件注释
<!--[if !IE]><!--> 您使用不是 Internet Explorer <!--<![endif]-->
<!--[if IE 6]><!--> 您正在使用Internet Explorer version 6或者 一个非IE 浏览器 <!--<![endif]-->
6、同源策略
在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略)。
这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制,即JavaScript只能访问与包含它的文档在同一域下的内容。
所谓同源是指,域名,协议,端口相同。
6.1 不严格的同源策略
同源策略会给那些使用多个子域名的网站带来麻烦,例如a.home.com要访问b.home.com或者访问c.sz.home.com的域名的时候就会受到
同源策略的限制。
为了解决这个问题可以采用document.domain的属性,默认情况下domain存放的是载入文档的服务器的主机名。可以设置这个属性不过使用的字符串
必须具有有效的域前缀或者它自己本身。domain的属性必须有一个点“.”不可以设置如com或者cn。例如上面的a.home.com可以设置成home.com,c.sz.home.com
可以设置成sz.home.com或者home.com.
当我们设置a.home.com、b.home.com、c.sz.home.com的domain为home.com这个时候三者就可以进行数据通讯了。
6.2 不严格的同源策略第二项
这个标准已经标准化,这个标准草案用新的Origin请求头和新的Access-Control-Allow-Origin响应头来扩展http.它允许服务器显式的列出源。或使用通配符来匹配所有的源
来请求文件。
6.3 不严格的同源策略第三项
跨文档消息,允许来自一个文档的脚本可以传递文本消息到另一个文档里的脚本,而不管脚本的来源如何。调用window.postMessage()方法
可以异步的传递消息。

web浏览器中javascript的更多相关文章

  1. 第十一章:WEB浏览器中的javascript

    客户端javascript涵盖在本系列的第二部分第10章,主要讲解javascript是如何在web浏览器中实现的,这些章节介绍了大量的脚本宿主对象,这些对象可以表示浏览器窗口.文档树的内容.这些章节 ...

  2. JavaScript权威指南--WEB浏览器中的javascript

    知识要点 1.客户端javascript window对象是所有客户端javascript特性和API的主要接入点.它表示web浏览器的一个窗口或窗体,并且可以用window表示来引用它.window ...

  3. 浏览器中Javascript单线程分析

    线程这个特性对于一门语言环境来说是尤其重要的,在Java/C++环境下都提供了多线程API操作. 但在Javascript中据说代码执行时单线程的,大量计算的逻辑会阻塞浏览器HTML渲染,但setTi ...

  4. web浏览器中的javascript -- 2

    在html里嵌入javascript: 在html文档里嵌入客户端javascript代码有4种方式: 1.内联,放置在<script>和</script>标签对之间; 2.放 ...

  5. 浏览器中JavaScript执行原理

    本章我们讨论javascript在浏览器中是如果工作的,包括:下载.解析.执行的全过程.javascript的这些讨人嫌的地方我们是知道的: i.需要串行下载 ii.需要解析 iii.需要串行执行 而 ...

  6. websocketj--随时随地在Web浏览器中操作你的服务端程序

    0 - 有没有觉得Linux标准终端界面输入输出枯燥无味? 1 - 什么?vmstat命令的输出数据不直观?有没有想过能够可视化该命令的输出? 2 - 尝试过用浏览器操作Windows中的cmd吗? ...

  7. 谷歌开发人员在现代Web浏览器中发现严重跨域漏洞

    Google谷歌研究人员在现代网络浏览器中发现了一个严重漏洞,该漏洞可能允许您访问的网站从您登录同一浏览器的其他网站窃取您的在线帐户的敏感内容. 由Google谷歌Chrome的开发者支持者Jake发 ...

  8. 在web浏览器中判断app是否安装并直接打开

    最近公司App产品在运营推广上有一个需求,就是要求可以让用户在访问我们的推广网页时,就可以判断出这个用户手机上是否安装了我们的App,如果安装了则可以直接在网页上打开,否则就引导用户前往下载.从而形成 ...

  9. web浏览器中的javascript 1

    Html 文档嵌入客户端有4种方式. 1. 内联.放置在<script>和</script>标签对之间. 2.放置在<script>标签的src属性指定的外部文件中 ...

随机推荐

  1. Android高级编程笔记(四)深入探讨Activity(转)

    在应用程序中至少包含一个用来处理应用程序的主UI功能的主界面屏幕.这个主界面一般由多个Fragment组成,并由一组次要Activity支持.要在屏幕之间切换,就必须要启动一个新的Activity.一 ...

  2. hibernate Java 时间和日期类型 Hibernate 制图

    基础知识: 于 Java 于, 型表示的时间和日期包含: java.util.Date 和 java.util.Calendar. 外, 在 JDBC API 中还提供了 3 个扩展了 java.ut ...

  3. linux下一个apache+tomcat负载均衡和集群

    先说一下我的环境 一个ubuntu虚拟机, 一个apache2.2示例 两tomcat1.7示例 1.安装apacheserver sudo apt-get install apache2 假设要重新 ...

  4. Spark1.0.0 学习路径

          2014-05-30 Spark1.0.0 Relaease 经过11次RC后最终公布.尽管还有不少bug,还是非常令人振奋. 作为一个骨灰级的老IT,经过非常成一段时间的消沉,再次被点燃 ...

  5. FZU 2082 过路费(树链剖分)

    FZU 2082 过路费 题目链接 树链抛分改动边的模板题 代码: #include <cstdio> #include <cstring> #include <vect ...

  6. android studio 在线更新android sdk,遇到无法Fetching https://dl-ssl.google.com/...的解决方式

    近期实在受不了eclipse的"迟钝",准备入手Android studio开发环境,可是貌似不太顺利,安装成功了Android studio,在线更新Android adk的时候 ...

  7. Centos7系统配置上的变化(二)网络管理基础

    原文 Centos7系统配置上的变化(二)网络管理基础 上篇简单介绍了CentOS 7 在服务和网络方面的一点变化,先前很多烂熟于心的操作指令已经不适用了,不管是否习惯,总要接受.熟悉这些变化. 写上 ...

  8. Mencached使用

    Mencached使用小记 该文章简单记录一下在Windows平台下安装与配置Memcached的方法,Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载. ...

  9. 大约SQL/NoSQL数据库搜索/思考查询

    转载请注明出处:jiq•钦's technical Blog Hbase特征: 近期在学习Hbase.Hbase基于行健是建立了索引的,查询速度会很快,全然实时. 可是Hbase要基于行健之外的字段进 ...

  10. 【android】ImageView的src和background以及两者之间的神奇的差异

    一.ImageView中XML属性src和background的差别: background会依据ImageView组件给定的长宽进行拉伸.而src就存放的是原图的大小,不会进行拉伸.src是图片内容 ...