将独立编辑的脚本及样式整合至网页的系统及其方法技术方案

本发明专利技术涉及一种将独立编辑的脚本及样式整合至网页的系统及其方法，其透过分析出网页所包含的脚本与样式名称后，将脚本所呼叫的函式写入函式文件中，并将网页中所使用的样式语法写入样式文件中，以及在网页中写入加载函式文件以及样式文件的网页语法，可以降低网页的原始码的复杂度，达成增加网页开发效率的技术功效。

【技术实现步骤摘要】

本专利技术涉及一种整合脚本(script)、样式与网页的系统及其方法，特别是指一种 。
技术介绍
在开发网页时，往往都需要依赖许多具有专业知识与技术的人员运用特定的应用 软件在计算机上进行网页的编辑，在网页完成编辑之后，再由开发人员将网页上传至提供 网站服务的服务器。早期的网页主要是由超文本标记语言(HyperText Markup Language, HTML)语法 与脚本组成，网页的开发人员大多是程序设计师，不过近来由于样式在网页中被大量的使 用，因此网页的开发人员除了程序设计师之外，也增加了与程序设计师的专业领域完全不 相同的视觉设计师。因此，目前网页开发的流程通常是由视觉设计师制作好加入了样式语 法的网页后，交由程序设计师撰写在浏览器上执行的脚本以及在服务器上执行的程序。不过，由于在网页开发的过程中，网页所呈现出来的画面以及提供操作的功能会 不断的调整，另外，网页的原始码并非由同一个人编辑，而是由视觉设计师以及程序设计师 共同开发，因此，当视觉设计师以及程序设计师对网页的原始码进行一次又一次的编辑之 后，网页的原始码会越来越杂乱，在这样的情况下，一旦网页所要呈现的画面或程序代码的 复杂度提高，网页的原始码会变的越来越长，如此，视觉设计师以及程序设计师将不易寻找 需要修改的样式语法或是脚本。综上所述，可知现有技术中长期以来一直存在不易在网页的原始码中寻找特定的 脚本以及样式语法的问题，因此有必要提出改进的技术手段，来解决此一问题。
技术实现思路
有鉴于现有技术存在不易在网页的原始码中寻找特定的脚本以及样式语法的问 题，本专利技术遂提供一种，其中本专利技术所提供的将独立编辑的脚本及样式整合至网页的系统，其包括有脚本函 式库，用以储存复数个函式；样式语法库，用以储存复数个样式语法；输入模块，用以输入 网页，网页至少包含脚本或样式名称；网页分析模块，用以由网页中分析出脚本及样式名 称；函式文件建立模块，用以于网页分析模块由网页中分析出脚本后，至脚本函式库中读取 执行脚本所需的函式，并将函式写入函式文件中；样式文件建立模块，用以于网页分析模块 由网页中分析出样式名称后，至样式语法库中读取对应样式名称的样式语法，并将样式语 法写入样式文件中；整合模块，用以于网页中写入加载函式文件的第一网页语法及加载样 式文件的第二网页语法；输出模块，用以输出包含第一网页语法或第二网页语法的网页，其 透过网页分析模块分析出网页中的脚本与样式名称后，函式文件建立模块会至脚本函式库 中读取函式并写入函式文件中，样式文件建立模块会至样式语法库中读取样式语法并写入 样式文件中，并由整合模块在网页中写入加载函式文件以及样式文件的网页语法，借以由分离脚本以及样式语法的技术来解决现有技术所存在的问题。本专利技术所提供的将独立编辑的脚本及样式整合至网页的方法，其包括有下列步 骤储存复数个函式及复数个样式语法；输入包含脚本或样式名称的网页；分析网页；当网 页包含脚本时，读取执行脚本所需的函式，并于写入函式至函式文件中后，于网页中写入载 入函式文件的第一网页语法；当网页包含样式名称时，读取对应样式名称的样式语法，并于 写入样式语法至样式文件中后，于网页中写入加载样式文件的第二网页语法；输出包含第 一网页语法或第二网页语法的网页，其透过分析出网页中的脚本与样式名称后，读取脚本 所呼叫的函式并写入函式文件中，读取网页所使用的样式语法并写入样式文件中，并在网 页中写入加载函式文件以及样式文件的网页语法，借以由分离脚本以及样式语法的方式来 解决现有技术所存在的问题。本专利技术所提供的系统与方法如上，其与现有技术之间的差异在于本专利技术会对网页 进行分析，在分析出网页所包含的脚本与样式名称后，读取脚本所呼叫的函式并将函式写 入函式文件中，以及读取网页所使用的样式语法并将样式语法写入样式文件中，并在网页 中写入加载函式文件以及样式文件的网页语法，借以由分离脚本以及样式语法来减低网页 的原始码的复杂度。透过上述的技术手段，本专利技术可以达成增加网页开发效率的技术功效。附图说明图1是本专利技术所提的将独立编辑的脚本及样式整合至网页的系统架构图。图2是本专利技术所提的将独立编辑的脚本及样式整合至网页的方法流程图。图3是本专利技术实施例所提的整合前的网页的原始码。图4A是本专利技术实施例所提的函式一览表示意图。图4B是本专利技术实施例所提的样式一览表示意图。图5A是本专利技术实施例所提的写入函式的函式文件。图5B是本专利技术实施例所提的写入样式语法的样式文件。图6是本专利技术实施例所提的整合后的网页的原始码。图7是本专利技术实施例所提的另一网页整合前的原始码。主要元件符号说明111脚本函式库112样式语法库120输入模块130网页分析模块151函式文件建立模块152样式文件建立模块160整合模块170输出模块180网页编辑模块191脚本管理模块192样式 管理模块300a 网页300b 网页300c 网页310 脚本320样式名称331第一网页语法332第二网页语法341第三网页语法342第四网页语法410函式一览表420样式一览表500函式文件600样式文件具体实施例方式以下将配合附图及实施例来详细说明本专利技术的详细特征与实施方式，内容足以使 任何本领域技术人员轻易地理解本专利技术解决技术问题所应用的技术手段并据以实施，及理 解实现本专利技术可达成的功效。本专利技术执行于网页开发环境中，提供本专利技术执行的网页开发环境可以为执行于计 算机中的网页编辑软件，使用者可以透过网页编辑软件使用本专利技术进行网页程序的开发； 提供本专利技术执行的网页开发环境也可以执行于服务器上，使用者透过客户端联机到服务器 后，透过服务器所提供的使用者接口上传已编辑完成的网页，由本专利技术对被上传的网页中 的HTML语法、脚本以及样式语法进行整合。以下先以图1本专利技术所提的将独立编辑的脚本及样式整合至网页的系统架构图来说明本专利技术的系统运作。如图1所示，本专利技术的系统含有脚本函式库111、样式语法库 112、输入模块120、网页分析模块130、函式文件建立模块151、样式文件建立模块152、整合 模块160以及输出模块170。脚本函式库111负责储存复数个函式，脚本函式库111所储存的函式为程序代码 (原始码)的形式，包含函式名称、呼叫(call)所需的参数以及函式主体等。样式语法库112负责储存复数个样式语法，样式语法库112所储存的样式语法包 含样式选择器(selector)以及至少一个样式定义。输入模块120负责输入网页300a，被输入模块120输入的网页300a除了包含HTML 语法之外，通常也包含一个以上的脚本、一个以上的样式名称或一个以上的脚本与一个以 上的样式名称。一般而言，网页300a是由使用者透过输入模块120输入至本系统中，但本 专利技术并不以此为限。网页分析模块130负责对被输入模块120输入的网页300a的原始码进行分 析(parser)，借以分析出网页300a所包含的各个元素(element)以及脚本，并由元素的 “class”属性中搜寻出样式名称。网页分析模块130更负责在对被输入模块120输入的网页300a进行分析后，由分 析后所获得的元素的特定属性或脚本的特定语法中搜寻出外部连结，并依据外部连结追溯(trace)网页300a被浏览时，显示网页3本文档来自技高网...

【技术保护点】
一种将独立编辑的脚本及样式整合至网页的系统，该系统包括：一脚本函式库，用以储存复数个函式；一样式语法库，用以储存复数个样式语法；一输入模块，用以输入一网页，该网页至少包含一脚本或一样式名称；网页分析模块，用以由该网页中分析出该脚本及该样式名称；一函式文件建立模块，用以于该网页分析模块由该网页中分析出该脚本后，至该脚本函式库中读取执行该脚本所需的至少一该函式，并将该函式写入一函式文件中；一样式文件建立模块，用以于该网页分析模块由该网页中分析出该样式名称后，至该样式语法库中读取对应该样式名称的一该样式语法，并将该样式语法写入一样式文件中；一整合模块，用以于该网页中写入加载该函式文件的第一网页语法及加载该样式文件的一第二网页语法；及一输出模块，用以输出包含该第一网页语法和／或该第二网页语法的该网页。

【技术特征摘要】

【专利技术属性】
技术研发人员：邱全成，翁佳，
申请(专利权)人：英业达股份有限公司，
类型：发明
国别省市：71[中国|台湾]