收藏本站 
广告服务 
网站地图 
>> 我们从网络和杂志上收集了近100000余篇各类电脑技术、网络技术、软件技术等方面的文章教程,我们的收录原则:不是精华拒不收录!
先飞电脑技术网技术文章
使浏览器实现JavaScript支持的方法解析
[ 作者:佚名    转贴自:网络转载    阅读次数:83    更新时间:2007-6-5 11:47:00   录入:刘光勇 ]         
    一、 基本的javascript 开发环境

javascript Reference与javascript API:

javascript Reference是用于建立包含javascript runtime的Library或 DLL,然后编译成小的 "shell" 程序,连接Library后生成交互式的javascript解释器,也可以用来解释.js 文件。

该程序不依赖Navigator代码。

生成的"shell" 程序,对比浏览器对javascript的支持,相同之处是使用相同的包含javascript runtime的Library 或 DLL,我们把这部份相同的Library或 DLL称为javascript API,我们实际开发javascript应用,也是在javascript API基础上工作,而不用过多考虑其内部的实现。关于javascript API,参见javascript API详解。

二、 javascript Engine

javascript Engine用于初始化javascript环境,提供对javascript解释、执行的接口。

初始化主要包括:

内存分配:rt=JS_Init(10000L);

初始化cx:cx = JS_NewContext(rt, STACK_CHUNK_SIZE);

初始化globalObj:globalObj = JS_NewObject(cx, &globalClass, 0, 0);

定义标准类:JS_InitStandardClasses(cx, globalObj);

定义系统函数:JS_DefineFunctions(cx, globalObj, g_functions);

定义报错函数:JS_SetErrorReporter(cx,JS_ErrorReporter);

注册其它类:

RegisterClassPoint(cx,globalObj);

RegisterClassSize(cx,globalObj);

RegisterClassRect(cx,globalObj);

RegisterClassPolygon (cx,globalObj);

RegisterClassColorKey (cx,globalObj);

RegisterClassTDTimer (cx,globalObj);

初始化定时器:TDTimerListInit();

提供对javascript解释、执行的接口函数:

TD_EvaluateScript(JSContext *cx,

JSObject *obj,

const char *bytes,

uintN length,

const char *filename,

uintN lineno,

jsval *rval)

三、 javascript与浏览器接合

基本概念:javascript操作HTML元素的常见方式

例:

<html>
<head>
<script>
<!--
function ChangeImage(index)
{image0.src="a"+index+".gif";}
-->
</script>
</head>
<a onmouseover="ChangeImage(0);">军人</a><br>
<a onmouseover="ChangeImage(1);">眼睛</a><br>
<ccid_file id="image0" values="a0" id="image0" src="a0.gif" /></img>
</html>

当鼠标移到文字上时,触发事件mouseover,调用ChangeImage()函数,结果为图像源(SRC)发生变化,重新调入新图片。

由此产生两个关键问题:

1. javascript如何获取HTML元素的名称和属性。

2. javascript如何改变HTML元素的属性,并操作WIDGET重画。

下面分别阐述这两个问题:

首先介绍涉及到的浏览器流程:

Tokenize -> BuildModel -> ProcessElement -> WidgetPaint

---------------------  ----------------------------

   |        |

  parse       layout

问题1解决:HTML元素作为javascript对象进行注册。

注册过程在BuildModel中进行。

BuildModel的首要任务是将Token后的结点按包含关系展成一棵树。

其次就是要将某些结点注册为javascript对象。

注册的过程是:

定义新对象:JSObject *proto;

初始化该对象:TD_JSXMLElementClassInit(JS_GetGlobalContext(),

(void **)&proto))

使用JS_DefineObject或JS_NewObject定义对象属性:

根据是否定义了该元素的名称区别对待:

if(TD_XMLContentIsNamedItem(aElement,&aName))
{
parent = js_GetGlobalObject();
*aReturn=JS_DefineObject(JS_GetGlobalContext(),js_GetGlobalObject(),aName->
mStr,&ElementClass,proto,JSPROP_ENUMERATE);
}
else
{
parent=aElement->parent->mScriptObject;
*aReturn = JS_NewObject(JS_GetGlobalContext(), &ElementClass, proto, parent);
}

将对象加入:

JS_SetPrivate(JS_GetGlobalContext(), (JSObject *)*aReturn, aElement);

这样,在编译时,HTML元素的标识就能被javascript编译器识别,否则会报错变量未定义。

问题2解决:利用注册给对象的函数实现操作符的功能化。

具体可理解为:

当image0.src ="1.gif"被执行时,相当于为对象设置或改变属性,此时SetElementProperty函数被调用(该函数在注册该对象时由 JSXMLElementClassInit捆绑给该对象,其内容由用户自己定义),SetElementProperty通过函数指针调用函数 TD_JSXMLSetAtrByID,改变结点树上结点属性,并重新生成该节点对应的widget,重画界面。

问题:如何建立javascript对象与结点树上结点的对应?

答: javascript对象与结点树是同时生成的,它们的共同性质是结点具有相同属性,javascript对象根据ID属性查找树,找到要操作的对应结点。

四、 浏览器消息响应

在主消息循环中调用TDWidgetProcessMsg,处理与widget有关消息。

首先:取得当前焦点所在的widgetpWidget=TDWidgetGetAtPoint(pThis->baseDoc.base.mWidget,pt,&index);

处理该widget对该消息的响应。

最后一般为调用javascript执行,实现实际响应。

TDVOID TDWidgetDoAction(TDPWidgetAction pAnchor)
{
jsval jval;
if(pAnchor)
TD_EvaluateScript(JS_GetGlobalContext(),js_GetGlobalObject(),
pAnchor->mAction.mStr,pAnchor->mAction.mLength,TDNULL,0,&jval);
}
上一篇:IE浏览器中一个值得关注的JS问题  下一篇: 使用JavaScript来实现浏览器菜单的命令  
网站主页 | 收藏本页 | 联系我们 | 广告服务 | 站点地图 | 会员注册 | 招聘信息 | 内容指正

联系QQ:先飞电脑技术网站事务联系QQ,点击可以直接留言. 32933427 电话:13710542091 [世界排名] 鄂ICP备05005890号