专利名称：搜寻互动元素以执行对应脚本的系统及其方法
技术领域：
一种脚本执行系统及其方法，特别是指一种搜寻互动元素以执行对应脚本的系统及其方法。
背景技术：
在开发网页时，往往都需要依赖许多具有专业知识与技术的人员运用特定的应用软件在电脑上进行网页的编辑，在网页完成编辑之后，再由开发人员将网页上传至提供网站服务的服务器。早期的网页主要是由超文本标记语言(HyperText Markup Language, HTML)语法与脚本(script)组成，网页的开发人员大多是程序设计师，不过近来由于样式表(CSS)在网页中被大量的使用，因此网页的开发人员除了程序设计师之外，也增加了与程序设计师的专业领域完全不相同的视觉设计师。因此，目前网页开发的流程通常是由视觉设计师制作好加入了样式语法的网页后，交由程序设计师在该网页中撰写给浏览器以及给服务器上执行的程序。不过，由于在网页开发的过程中，网页所呈现出来的画面以及提供操作的功能会不断的调整，此外，因为网页的原始码并非由同一个人编辑，而是由视觉设计师以及程序设计师共同开发，因此，当视觉设计师以及程序设计师对网页的原始码进行一次又一次的编辑之后，网页的原始码会越来越杂乱，在这样的情况下，一旦网页所要呈现的画面或程序码的复杂度提高，网页的原始码会变的越来越长，以越来越复杂，如此，视觉设计师不易修改网页中的样式语法，而程序设计师也不易修改网页中的脚本。另外，由于视觉设计师通常不熟悉脚本语法、程序设计师可能不熟悉样式语法，所以，当视觉设计师与程序设计师在修改网页的原始码时，往往不敢删除不熟悉的脚本语法或样式语法，如此将容易造成网页的原始码中出现多余的脚本语法或样式语法。综上所述，可知现有技术中长期以来一直存在同时包含HTML语法、样式语法以及脚本语法的网页原始码不易维护且容易出现多余语法的问题，因此有必要提出改进的技术手段，来解决此一问题。
发明内容
有鉴于现有技术存在同时包含HTML语法、样式语法以及脚本语法的网页原始码不易维护且容易出现多余语法的问题，本发明于是公开一种搜寻互动元素以执行对应脚本的系统及其方法，其中本发明所公开的搜寻互动元素以执行对应脚本的系统，至少包含输入模块；网页载入模块，用以载入包含至少一脚本函数的目标网页，目标网页的标签中不包含脚本语法；网页处理模块，用以依据目标网页中的脚本产生元素搜寻单元以及脚本执行单元，元素搜寻单元用以于目标网页中搜寻包含被输入模块所触发的互动事件的元素，脚本执行单元用以使用元素执行对应互动事件的脚本函数并产生执行结果；显示模块，用以显示网页载入模块所载入的目标网页，及用以依据执行结果变更显示目标网页。本发明所公开的搜寻互动元素以执行对应脚本的系统，其中，元素搜寻单元为XML 路径语言(XML Path Language, XPath)迭代器及/或CSS迭代器；互动事件为光标移动至元素、光标移出元素、光标点击元素；执行结果为元素的内容的显示或隐藏及/或元素的属性的改变。本发明所公开的搜寻互动元素以执行对应脚本的系统，其中，目标网页还可以包含记录脚本函数的函数档的连结，网页载入模块更用以依据函数档的连结载入函数档；目标网页也可以包含记录所使用的样式语法的样式档的连结，网页载入模块更用以依据样式档的连结载入样式档。本发明所公开的搜寻互动元素以执行对应脚本的方法，其步骤至少包括载入包含至少一脚本函数的目标网页，目标网页的标签中不包含脚本语法；显示目标网页；触发目标网页中的元素所包含的互动事件；于目标网页中搜寻元素；使用元素执行与互动事件对应的脚本函数，借以产生执行结果；依据执行结果变更显示目标网页。本发明所公开的搜寻互动元素以执行对应脚本的方法，其中，载入包含脚本函数的目标网页的步骤可以包含依据目标网页中，记录函数档的连结，载入包含脚本函数的函数档的步骤，或包含依据目标网页中，记录样式档的连结，载入包含样式语法的样式档的步马聚O本发明所公开的搜寻互动元素以执行对应脚本的方法，其中，依据执行结果变更显示目标网页的步骤为显示或隐藏元素的内容及/或显示由执行结果所改变的元素的属性。本发明所公开的系统与方法如上，与现有技术之间的差异在于本发明通过在目标网页中加入元素搜寻单元，在目标网页中的互动事件被触发后，元素搜寻单元会搜寻出包含被触发的互动事件的元素，使得与互动事件对应的脚本语法被执行，借以解决现有技术所存在的问题，并可以达成提高开发/维护网页与程序码的效率的技术功效。
图1为本发明所提的搜寻互动元素以执行对应脚本的系统架构图。图2为本发明所提的搜寻互动元素以执行对应脚本的方法流程图。图3A为本发明实施例所提的目标网页的部分原始码示意图。图;3B为本发明实施例所提的脚本示意图。
主要元件符号说明100浏览器 110网页载入模块120输入模块 130网页处理模块132元素搜寻模块 136脚本执行模块140显示模块 301目标网页302脚本 330元素381脚本语法 382脚本语法400储存媒体
具体实施例方式以下将配合图式及实施例来详细说明本发明的特征与实施方式，内容足以使任何熟习相关技艺者能够轻易地充分理解本发明解决技术问题所应用的技术手段并据以实施， 借此实现本发明可达成的功效。本发明是在目标网页中加入能够在互动事件发生后，自动搜寻目标网页中产生互动事件的元素(element)的脚本，使得需要以脚本改变元素的显示状态或内容的目标网页中，可以将专门用来显示网页元素的HTML语法以及样式(CSQ语法可以与被执行的脚本分离，而不需要混在同一处撰写。也就是说，使用本发明，可以使得用来描述目标网页的各个元素的标签不包含任何的脚本语法，方便视觉设计师建立以及修改目标网页。其中，本发明所提的脚本，为目标网页中的特定脚本语法的集合，可以由多个脚本语法、一个或多个脚本函数、或是由一个或多个脚本语法与一个或多个脚本函数所组成；本发明所提的脚本函数则由多个脚本语法所组成，其可以达成特定的功能。本发明所提的互动事件为使用者可以操作光标触发目标网页中的元素所包含的事件，例如光标移动至元素所触发的onmouseoverO事件、光标移出元素onmouseout ()事件、光标点击元素onclickO事件等，但本发明并不以此为限。以下先以图1本发明所提的搜寻互动元素以执行对应脚本的系统架构图来说明本发明的系统运作。如图1所示，本发明的系统应用在网页的浏览器100中，其中包含网页载入模块110、输入模块120、网页处理模块130以及显示模块140。网页载入模块110负责载入目标网页，其中，被网页载入模块110载入的目标网页储存于执行浏览器100的装置中，一般而言，执行浏览器100的装置会以储存媒体400储存目标网页。网页载入模块110所载入的目标网页可以为将HTML语法及样式语法与脚本语法撰写在一个档案的不同部分，在此情况下，目标网页中的HTML语法及样式语法与脚本语法会有明显的区隔，不会有夹杂的语法。目标网页也可以为包含具有样式名称的HTML语法、 函数档的连结以及样式档的连结的档案，网页载入模块110会在载入目标网页后，依据函数档的连结与样式档的连结，至储存媒体400中读取记录脚本函数的函数档以及记录样式语法的样式档，借以完成目标网页的载入。输入模块120负责提供触发目标网页中某一元素所包含的互动事件。一般而言， 输入模块120是提供目标网页的浏览者操作光标进行移动与点击，借以触发光标移动至元素、光标移出元素、光标点击元素等互动事件。网页处理模块130负责依据目标网页中的脚本产生元素搜寻单元132以及脚本执行单元136，借以让目标网页中的互动事件所对应的脚本可以正常执行。元素搜寻单元132负责于目标网页中搜寻包含被输入模块120所触发的互动事件的元素。元素搜寻单元132可以将目标网页视为资料结构的树(tree)，而树的节点 (node)便是目标网页中的元素，因此，元素搜寻单元132可以为XML路径语言(XML Path Language, XPath)迭代器及/或CSS迭代器等使用类似技术的元件。脚本执行单元136负责使用元素搜寻单元132所搜寻出的包含被触发的互动事件的元素执行与被触发的互动事件对应的脚本，被脚本执行单元136执行的脚本通常为函数的形式，但本发明并不以此为限。其中，若目标网页以连结的方式记录包含脚本函数的函数档，则与被触发的互动事件对应的脚本函数通常会被记录在函数档中，但本发明也不以此为限。脚本执行单元136在执行与被触发的互动事件对应的脚本后，会产生相对应的执行结果。脚本执行单元136所产生的执行结果为目标网页中的一个或多个元素的内容的显示或隐藏，及/或目标网页中的一个或多个元素的属性(attribute)的改变，但本发明并不以此为限。其中，内容被显示或被隐藏的元素例如「<div··· >··· </div>」、「<li…>··· </li>J 等元素，但本发明并不以此为限；而属性被改变的元素包含但不限于图片元素<img…〉、连结元素<a…></a>等，被改变的属性可以为图片路径、连结位置、样式语法、资料内容等，本发明并不以此为限。显示模块140负责依据网页载入模块110所载入的目标网页中的各个标签，将目标网页的各个元素显示在浏览器100中，显示模块140也负责依据脚本执行单元所产生的执行结果，变更显示目标网页的各元素的显示状态或被显示的资料内容。接着以一个实施例来解说本发明的运作系统与方法，并请参照图2本发明所提的搜寻互动元素以执行对应脚本的方法流程图。在浏览者欲使用浏览器100浏览目标网页301时，浏览者会操作浏览器100中的网页载入模块110载入目标网页301 (步骤210)。在本实施例中，假设目标网页301以本发明的概念开发，则目标网页301将如图3A所示，在「<ul.">...</ul>」「<li" …</li>」、 「<div...>...</div>」、「<sparr">...</span>」、「<a href =…>...</a>」等单纯的 HTML 语法， 以及「class=" ···"」、「style="…"」等样式语法，而没有包含任何的脚本语法。其中，若目标网页301并未直接包含样式语法/脚本语法，而是包含连结到记录样式语法/脚本语法的样式档/脚本档，则网页载入模块110会依据目标网页301所包含的样式档/脚本档的连结，下载样式档/脚本档，借以载入样式档/脚本档中的样式语法/脚本语法。在网页载入模块110载入目标网页301 (步骤210)后，显示模块140会在浏览器 100的使用者界面中显示出目标网页301 (步骤220)，使得输入模块120提供使用者操作光标来触发目标网页301中某个元素的互动事件(步骤230)。在本实施例中，假设被触发的互动事件为光标移动到元素上，当使用者通过输入模块120将光标移动到元素330在浏览器100的使用者界面上所代表的物件(object)上时，元素330所包含的互动事件被触发。之后，网页处理模块130中的元素搜寻单元132会在目标网页301中搜寻包含被触发的互动事件的元素(步骤250)。在本发明中，假设元素搜寻单元132为「XPath迭代器」，则元素搜寻单元132可以顺利的搜寻到包含被触发的互动事件的元素为元素330。在网页处理模块130中的元素搜寻单元132于目标网页301中搜寻到包含被触发的互动事件的元素(步骤250)后，网页处理模块130中的脚本执行单元136会使用被元素搜寻单元132所搜寻出的元素执行与互动事件对应的脚本函数，借以产生执行结果(步骤 260)。在本实施例中，假设与互动事件对应的脚本函数中的脚本302如图;3B所示，则当元素330在互动事件被触发时内容为显示(visible)，则脚本执行单元136会执行脚本302中的脚本语法381，如此，脚本执行单元136会产生隐藏元素330所包含的内容以及更换目标网页301中某一图片元素的图片的执行结果；而若元素330在互动事件被触发时内容为隐藏(hide)，则脚本执行单元136会执行脚本302中的脚本语法382，如此，脚本执行单元136 会产生显示元素330所包含的内容以及更换目标网页301中某一图片元素的图片的执行结果。在网页处理模块130中的脚本执行单元136执行与被触发的互动事件对应的脚本函数而产生执行结果(步骤260)后，显示模块140会执行结果变更显示目标网页。在本实施例中，也就是显示模块140会依据脚本执行单元136所产生的执行结果隐藏或显示元素 330的内容，且更换显示图片元素为相对应的图片。如此，目标网页301中的脚本与HTML语法以及样式语法即可以分开撰写，而达到同样的显示效果。综上所述，可知本发明与现有技术之间的差异在于具有在目标网页中加入元素搜寻单元，在目标网页中的互动事件被触发后，元素搜寻单元会搜寻出包含被触发的互动事件的元素，使得与互动事件对应的脚本语法被执行的技术手段，借由此一技术手段可以解决现有技术所存在同时包含HTML语法、样式语法以及脚本语法的网页原始码不易维护且容易出现多余语法的问题，进而达成提高开发/维护网页与程序码的效率的技术功效。再者，本发明的于互动事件触发时搜寻元素以执行相对应脚本的方法，可实现于硬件、软件或硬件与软件的组合中，也可在电脑系统中以集中方式实现或以不同元件散布于若干互连的电脑系统的分散方式实现。虽然本发明所公开的实施方式如上，只是所述的内容并非用以直接限定本发明的专利保护范围。任何本发明所属技术领域中具有通常知识者，在不脱离本发明所公开的精神和范围的前提下，对本发明的实施的形式上及细节上作些许的更动润饰，均属于本发明的专利保护范围。本发明的专利保护范围，仍须以所附的权利要求所界定者为准。
权利要求
1.一种搜寻互动元素以执行对应脚本的系统，应用于一浏览器，其特征在于，该系统至少包含一输入模块；一网页载入模块，用以载入包含至少一脚本函数的一目标网页，该目标网页的标签中不包含脚本语法；一网页处理模块，用以依据该目标网页中的所有脚本语法产生下列单元一元素搜寻单元，用以于该目标网页中搜寻包含被该输入模块所触发的一互动事件的一元素；及一脚本执行单元，用以使用该元素执行对应该互动事件的该脚本函数，并产生一执行结果；及一显示模块，用以显示该网页载入模块所载入的该目标网页，及用以依据该执行结果变更显示该目标网页。
2.如权利要求1所述的搜寻互动元素以执行对应脚本的系统，其特征在于，其中该元素搜寻单元为XML路径语言(XML Path Language, XPath)迭代器及/或CSS迭代器。
3.如权利要求1所述的搜寻互动元素以执行对应脚本的系统，其特征在于，其中该目标网页更包含记录该些脚本函数的一函数档的一连结，该网页载入模块更用以依据该连结载入该函数档。
4.如权利要求1所述的搜寻互动元素以执行对应脚本的系统，其特征在于，其中该目标网页更包含记录所使用的样式语法的一样式档的一连结，该网页载入模块更用以依据该连结载入该样式档。
5.如权利要求1所述的搜寻互动元素以执行对应脚本的系统，其特征在于，其中该互动事件为光标移动至该元素、光标移出该元素、光标点击该元素。
6.如权利要求1所述的搜寻互动元素以执行对应脚本的系统，其特征在于，其中该执行结果为该元素的内容的显示或隐藏及/或该元素的属性的改变。
7.一种搜寻互动元素以执行对应脚本的方法，应用于一浏览器，其特征在于，该方法至少包含下列步骤载入包含至少一脚本函数的一目标网页，该目标网页的标签中不包含脚本语法；显示该目标网页；触发该目标网页中的一元素所包含的一互动事件；于该目标网页中搜寻该元素；使用该元素执行与该互动事件对应的该脚本函数，借以产生一执行结果；及依据该执行结果变更显示该目标网页。
8.如权利要求7所述的搜寻互动元素以执行对应脚本的方法，其特征在于，其中该载入包含该些脚本函数的该目标网页的步骤包含依据该目标网页中，记录一函数档的连结， 载入包含该些脚本函数的该函数档的步骤。
9.如权利要求7所述的搜寻互动元素以执行对应脚本的方法，其特征在于，其中该载入包含该些脚本函数的该目标网页的步骤包含依据该目标网页中，记录一样式档的连结， 载入包含该些样式语法的该样式档的步骤。
10.如权利要求7所述的搜寻互动元素以执行对应脚本的方法，其特征在于，其中该依据该执行结果变更显示该目标网页的步骤为显示或隐藏该元素的内容及/或显示由该执行结果所改变的该元素的属性。
全文摘要
本发明公开了一种搜寻互动元素以执行对应脚本的系统及其方法，其通过在目标网页中加入元素搜寻单元，在目标网页中的互动事件被触发后，元素搜寻单元会搜寻出包含被触发的互动事件的元素，使得与互动事件对应的脚本语法被执行的技术手段，可以分离网页中的HTML语法及样式语法与脚本语法，并达成提高开发/维护网页与程序码的效率的技术功效。
文档编号G06F17/30GK102236546SQ201010163258
公开日2011年11月9日 申请日期2010年4月30日 优先权日2010年4月30日
发明者方慧, 邱全成 申请人:英业达股份有限公司