大家有没有想过,一段javascript脚本从载入浏览器到显示执行都经过了哪些流程,其执行次序又是如何。本篇博文将引出‘javascript执行模型‘的概念,并带领大家理解javascript在执行时的处理机制。 简单的开始简单的代码:1234567891011<script type="text/javascript" src="xxx.js"></script><script type="text/javascript"> var i = 10; function say(msg){ alert(msg); }</script><script type="text/javascrip...
一些公共对象。详细参考手册。 一、Window 对象 Window 对象表示浏览器中打开的窗口。 如果文档包含框架(<frame> 或 <iframe> 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。 注意: 没有应用于 window 对象的公开标准,不过所有浏览器都支持该对象。属性描述closed返回窗口是否已被关闭。defaultStatus设置或返回窗口状态栏中的默认文本。document对 Document 对象的...
JS设置和获取盒模型的宽和高dom.style.width/height:只能取出内联样式的宽度和高度dom.currentStyle.width/height:获取即时的计算的样式,但是只有IE支持window.getComputedStyle(dom).width:获取即时计算的样式,支持其他浏览器,兼容性更好dom.getBoundingClientRect( ).width/height:计算盒模型在页面中的绝对位置,比较少用。dom.offsetWidth/offectHeight:返回元素实际大小一、dom.style.width/height 这种方式只能取...
事件模型冒泡型事件(Bubbling):事件由叶子节点沿祖先节点一直向上传递到根节点捕获型事件(Capturing):由DOM树最顶元素一直到最精确的元素,与冒泡型事件相反DOM标准事件模型:DOM标准既支持冒泡型事件,也支持捕获型事件,可以说是两者的结合体,首先是捕获型,接着冒泡传递事件对象在IE浏览器中事件对象是window的一个属性,在DOM标准中,event必须作为唯一的参数传给事件处理函数获得兼容的event 对象:function(event){ /...
一、Window 对象: (1)、所有浏览器都支持 window 对象,它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。 (2)、全局变量是 window 对象的属性;全局函数是 window 对象的方法。二、Window 对象方法和属性:( https://www.w3cschool.cn/jsref/obj-window.html )三、Window 尺寸判断: (1)、对于IE9至IE9以上、Chrome、Firefox、Opera 以及 Safari: ...
利用节点间的层次关系获取节点:
上一节讲了3中获取的方式: * ※※一、绝对获取,获取元素的3种方式:—Element * 1、getElementById(): 通过标签中的id属性值获来取该标签对象 * 2、getElementsByName(): 通过标签中的name属性值来获取该标签对象集合 * 3、getElementsByTagName(): 通过标签名来获取该标签对象集合现在来看看相对获取的方式:※※二、相对获取(利用节点之间的层次关系),获取节点:—Node 1、父节点:parentNode...
JavaScript作用: 用来给页面添加动态的效果LiveScript 改成 JavaScript 为了蹭热度语言特点:属于脚本语言, 不需要编译 直接解析执行.属于弱类型语言, 变量声明时不需要指定类型 Java: int x = 10; String name="tom"; x="Jerry";编译报错JavaScript: let x=10; let name="tom"; x="Jerry"; 不会报错安全性高: 这门语言由于是嵌入到html页面中,最终执行在客户端浏览器中的语言,所以对安全性要求较高交互性强: JS语言是嵌入到html页面...
1. Javascript的运行时模型——事件循环 JS的运行时是个单线程的运行时,它不像其他编程语言,比如C++,Java,C#这些可以进行多线程操作的语言。当它执行一个函数时,它只会一条路走到黑,不会在当前函数结束之前去调用其他的函数(除非当前函数主动调用其他函数)。它也不用担心会有其他线程打扰它,因为它的运行时只有一个线程。如果你还记得一些计算机原理的话,这种运行时只有一个栈,设计起来相当的简单。一条路走到黑的设计很...
一、场景及问题背景: 我们平时开发时本质上就是对应用程序的各种状态进行切换并作出相应处理。最直接的解决方案是将这些所有可能发生的情况全都考虑到,然后使用if... ellse语句来做状态判断来进行不同情况的处理。但是对复杂状态的判断就显得代码逻辑特别的乱。随着增加新的状态或者修改一个状态,if else或switch case语句就要相应的的增多或者修改,程序的可读性,扩展性就会变得很弱。维护也会很麻烦。 先来个例子,魂斗...
JavaScript有一个基于事件循环的并发模型,事件循环负责执行代码,收集和处理事件以及执行队列中的子任务。
并发模型与事件循环(Concurrency model and Event loop)
包含对 栈 堆 队列的理解运行时(runtime)概念可视化描述Frame 帧;Stack 栈;Heap 堆;Queue 队列栈函数调用形成了一个由若干帧组成的栈,比如:function foo(b) {let a = 10 ;return a + b + 11;
}function bar(x) {let y = 3 ;return foo(x * y);
}console.log(...
JavaScript 一个最简单的事件模型,需要有事件绑定与触发,也许还要有事件删除。 1var eventModel = {2 list: {},3 4 bind: function () {5var args = [].slice.apply(arguments),6 type = args[0],7 handlers = args.slice(1);8 9if (typeof type === ‘string‘ && handlers.length > 0) {
10for (var i = 0; i < handlers.length; i++) {
11if (typeof handlers[i] === ‘function‘) {
12if (!this.list[type]) {
1...
浏览器对象模型(BOM)以window对象对象为委托,表示浏览器窗口以及页面可见区域。同时,window对象还是ECMAScript中global对象,因而所有全局变量和函数都是它的属性,且所有原生的构造函数函数及其他函数也都是存在于它的命名空间下。本章讨论了下列BOM的组成部分。 1.在使用框架时,每个框架都有自己的window对象以及所有原生构造函数及其他函数的副本。每个框架都保存在frames集合中,可以通过位置或通过名称来访问。 2.有...
最近在做一个vrpie的项目,用vrp建模生成vrpie,然后在网页上面显示,这里需要和网页上面的其他内容交互,现在总结一下开发经验。第一个需求是在网页上面点击那个的时候做一些事情,通过查找sdk找到了方法通过这个实现了,代码如下:<script for="Vrpie1" event="OnVrpEvent(msg,p1,p2,p3,p4)" language="Jscript">{var str = window.Vrpie1.GetVrpMsgDesc(msg, p1, p2, p3, p4);if (msg == ‘601‘) {//这是模型加载好后接收到的消...
JS事件流模型事件捕获Event Capturing是一种从上而下的传播方式,以click事件为例,其会从最外层根节向内传播到达点击的节点,为从最外层节点逐渐向内传播直到目标节点的方式。
事件冒泡Event Bubbling是一种从下往上的传播方式,同样以click事件为例,事件最开始由点击的节点,然后逐渐向上传播直至最高层节点。DOM0级模型也称为原始事件模型,这种方式较为简单且兼容所有浏览器,但是却将界面与逻辑耦合在一起,可维护性差。实例...
1. DOM基本介绍1 什么是DOMDOM的英语全称为Document Object Model,翻译成中文就 是文档对象模型。也就是说,将整个文档看作是一个对象。而一个文档又是由很多节点组成的, 那么这些节点也可以被看作是一个个的对象。DOM里面的对象属于宿主对象,需要浏览器来作 为宿主。一旦离开了浏览器这个环境,那么该对象将不复存在。同样,上一章我们所介绍的 BOM也是如此,需要浏览器来作为宿主,所以它也是一个宿主对象。DOM的作用如下:?浏...