CN103226475B - 转码时实现控件替换的方法及装置 - Google Patents
转码时实现控件替换的方法及装置 Download PDFInfo
- Publication number
- CN103226475B CN103226475B CN201310182545.4A CN201310182545A CN103226475B CN 103226475 B CN103226475 B CN 103226475B CN 201310182545 A CN201310182545 A CN 201310182545A CN 103226475 B CN103226475 B CN 103226475B
- Authority
- CN
- China
- Prior art keywords
- control
- pattern
- webpage
- node
- content node
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
本发明提出了一种转码时实现控件替换的方法,包括以下步骤:线下获取网页上的第一控件及所述第一控件操纵的第一内容节点;将第一内容节点以pattern和xpath的形式输出到模板文件;线上载入模板文件;当用户访问的网页包括模板文件中的pattern和xpath时,识别并标注网页的第一控件及所述第一控件操纵的第一内容节点;通过重写脚本来生成第二控件以替换第一控件。本发明还提出了一种转码时实现控件替换的装置。本发明通过替换原网页中使用了脚本而不能正常工作的控件及节点,使用户在使用移动终端时也可以正常地浏览这些网页,为用户提供了便利。
Description
技术领域
本发明涉及移动终端互联网应用技术领域,特别涉及一种转码时实现控件替换的方法及装置。
背景技术
当前的互联网上的大部分网页都是为PC(PersonalComputer,个人电脑)浏览而设计的,通常不会考虑到手机、平板电脑等移动终端的流量、性能和兼容性等问题。为了方便原本为PC浏览设计的网页能够较好地运行在手机、平板电脑等移动终端上,通常移动终端会向用户提供网页的转码服务。
但是,当网页经过转码后,DOM树结构会发生改变,javascript等脚本也不能运行。如果原网页中有一些重要的信息使用javascript脚本的控件进行实现,则转码后这些控件就不能正常工作了,造成网页中重要信息的丢失。例如网站中的tab选项卡,在PC浏览时可以显示多个选项卡,并且用户通过鼠标点击或者移动至某个选项卡上,自动显示该选项卡对应的tab内容,如http://www.55bbs.com/中用户点击“购物”则对应出现购物的tab的内容,如果点击“丽人”则对应出现丽人的tab的内容,但是在移动终端只能显示一个tab的内容,其他tab的内容都被消除或者隐藏了,用户无法通过交互切换不同的tab以浏览对应的内容。
发明内容
本发明旨在至少在一定程度上解决上述技术问题之一或至少提供一种有用的商业选择。
为此,本发明的第一个目的在于提出一种转码时实现控件替换的方法及装置,可以让用户在使用移动终端浏览使用javascript等脚本的网页时也可以实现正常浏览。本发明的第二个目的在于提出一种转码时实现控件替换的装置。
为达到上述目的,本发明第一方面的实施例提出了一种转码时实现控件替换的方法,包括以下步骤:线下获取网页上的第一控件及所述第一控件操纵的第一内容节点;将所述节点以pattern和xpath的形式输出到模板文件;线上载入所述模板文件;当用户访问的网页包括所述模板文件中的所述pattern和xpath时,识别并标注所述网页的第一控件及所述第一控件操纵的第一内容节点;通过重写脚本来生成第二控件以替换所述第一控件。
根据本发明实施例的转码时实现控件替换的方法,通过分析原网页中使用了脚本而不能正常工作的控件及节点,并自动加以替换,且保证替换后的网页跟原网页具有同样的结构和内容,使用户在使用移动终端时也可以正常地浏览这些网页,为用户提供了便利。
在本发明的一个实施例中,所述转码时实现控件替换的方法进一步包括:向所述第二控件操纵的第二内容节点增加样式和布局信息。
在本发明的一个实施例中,所述获取网页上的第一控件及所述第一控件操纵的第一内容节点的步骤包括:获取所述网页的DOM树样式;对具有鼠标事件的DOM树上的节点模拟鼠标事件;获取模拟鼠标事件后所述DOM树样式的变化;根据所述变化获取网页上的第一控件及所述第一控件操纵的第一内容节点。
在本发明的一个实施例中,所述样式和布局信息与所述第一内容节点的样式和布局信息对应。
本发明第二方面的实施例提出了一种转码时实现控件替换的装置,包括:线下获取模块,所述线下获取模块用于线下获取网页上的第一控件及所述第一控件操纵的第一内容节点;输出模块,所述输出模块用于将所述节点以pattern和xpath的形式输出到模板文件;线上载入模块,所述线上载入模块用于线上载入所述模板文件;识别模块,所述识别模块用于当用户访问的网页包括所述模板文件中的所述pattern和xpath时,识别并标注所述网页的第一控件及所述第一控件操纵的第一内容节点;替换模块,所述替换模块用于通过重写javascript来生成第二控件以替换所述第一控件。
根据本发明实施例的转码时实现控件替换的装置,通过分析原网页中使用了脚本而不能正常工作的控件及节点,并自动加以替换,且保证替换后的网页跟原网页具有同样的结构和内容,使用户在使用移动终端时也可以正常地浏览这些网页,为用户提供了便利。
在本发明的一个实施例中,所述转码时实现控件替换的装置进一步包括:增加模块,所述增加模块用于向所述第二控件操纵的第二内容节点增加样式和布局信息。
在本发明的一个实施例中,所述线下获取模块包括:第一获取单元,所述第一获取单元用于获取所述网页的DOM树样式;模拟单元,所述模拟单元用于对具有鼠标事件的DOM树上的节点模拟鼠标事件;第二获取单元,所述第二获取单元用于获取模拟鼠标事件后所述DOM树样式的变化;第三获取单元,所述第三获取单元用于根据所述变化获取网页上的第一控件及所述第一控件操纵的第一内容节点。
在本发明的一个实施例中,所述样式和布局信息与第一内容节点的样式和布局信息对应。
本发明的附加方面和优点将在下面的描述中部分给出,部分将从下面的描述中变得明显,或通过本发明的实践了解到。
附图说明
本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变得明显和容易理解,其中:
图1为本发明一个实施例的转码时实现控件替换的方法的流程图;
图2为本发明另一个实施例的转码时实现控件替换的方法的流程图;
图3为本发明一个实施例的转码时实现控件替换的装置的示意图;以及
图4为本发明另一个实施例的转码时实现控件替换的装置的示意图。
具体实施方式
下面详细描述本发明的实施例,所述实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,旨在用于解释本发明,而不能理解为对本发明的限制。
在本发明中,除非另有明确的规定和限定,术语“安装”、“相连”、“连接”、“固定”等术语应做广义理解,例如,可以是固定连接,也可以是可拆卸连接,或一体地连接;可以是机械连接,也可以是电连接;可以是直接相连,也可以通过中间媒介间接相连,可以是两个元件内部的连通。对于本领域的普通技术人员而言,可以根据具体情况理解上述术语在本发明中的具体含义。
下面分别参考图1和图2对本发明实施例的转码时实现控件替换的方法的流程进行描述。
如图1所示,根据本发明第一方面的实施例的转码时实现控件替换的方法,包括以下步骤:
S101:线下获取网页上的第一控件及第一控件操纵的第一内容节点。
具体地,对网页的分析可通过网页挖掘程序来实现,之后,如图2所示,获取网页上的第一控件及第一控件操纵的第一内容节点包括以下步骤:
S1011:获取网页及其DOM树样式。
DOM,即文档对象模型(DocumentObjectModel),是一个来自W3C的成熟标准。DOM是一种在浏览器内编程的模型,同时也是XML(eXtensibleMarkupLanguage,可扩展标记语言)的主要接口,DOM与语言和平台无关,它是基于树的API(ApplicationProgrammingInterface,应用程序编程接口),它把所有的数据以父子的节点层次结构装入内存构成一棵树,这些节点的类型可以是元素、文本、属性、注释或其它。DOM树允许开发者读取、创建、删除和编辑XML数据。
S1012:对具有鼠标事件的DOM树上的节点模拟鼠标事件。
如果DOM树上的某个节点具有鼠标事件,则线下程序模拟该鼠标事件。
S1013:获取模拟鼠标事件后DOM树样式的变化。
对比模拟鼠标事件前后,检查DOM树样式的变化,从而检查出可能无法正常工作的控件,即第一控件。
S1014:根据DOM树样式的变化获取网页上的第一控件及第一控件操作的第一内容节点。
无法正常工作的第一控件所操作的DOM节点即为第一内容节点。在具体实施例中,第一控件包括但不仅限于:javascript控件、ajax控件等。
S102:将第一内容节点以pattern和xpath的形式输出到模板文件。
本地程序将节点以pattern和xpath的形式输出到模板文件。
S103:线上载入模板文件。
线上转码程序载入S102步骤中输出的模板文件。如S102步骤所述,模板文件中存储了pattern和xpath形式的节点信息。其中,节点信息中还可以注明为有鼠标事件的DOM节点以及用户鼠标点击该节点之后可操作的另外的DOM节点。
S104:当用户访问的网页包括模板文件中的pattern和xpath时,识别并标注网页的第一控件及第一控件操纵的第一内容节点。
当用户访问网页时,如果检测到该网页包括模板文件中的pattern和xpath时,即说明该网页包含有可能无法正常工作的javascript、ajax等需要转换的控件,对这些控件进行识别并标注,并标记这些控件操纵的内容节点。具体地,转码程序会将含有鼠标事件的节点分别加上一个js点击事件,并设置好相应的参数,参数包括对应的***作的DOM节点的id及class属性。
S105:通过重写脚本来生成第二控件以替换第一控件。
具体地,首先通过class属性获得DOM节点列表,将DOM节点列表中的display属性设置为none以隐藏该节点,通过id属性得到需要显示的DOM节点,并把该节点的display属性设置为block以显示该节点,并设置相应的css样式。
其中,重写javascript或ajax脚本来生成第二控件,以替换第一控件。
在本发明的一个实施例中,如图2所示,重写脚本后,为保证转码后的网页在布局上与原网页一致,转码时实现控件替换的方法还包括:
S106:向第二控件操纵的第二内容节点增加样式和布局信息。
向第二内容节点增加的样式和布局信息,应当与第一内容节点对应的样式与布局信息相对应。具体地,重写之后,节点发生了变化,但之前的样式会保存下来,通过增加样式和布局信息将之前保存的样式增加到重写之后的新节点上。
根据本发明实施例的转码时实现控件替换的方法,在用户通过移动终端访问包括javascript、ajax等脚本的网页时,对不能正常工作的控件进行转码和重写,以避免网页内容因控件不能正常控件而丢失,并且保持了与原网页控件一致的布局,为用户提供了便利。
如图3所示,根据本发明第二方面的实施例的转码时实现控件替换的装置,包括:
线下获取模块610、输出模块620、线上载入模块630、识别模块640和替换模块650。具体地,线下获取模块610用于线下获取网页上的第一控件及第一控件操纵的第一内容节点。其中,第一控件是用户在移动终端上浏览时不能正常工作的控件,包括javascript、ajax脚本控件等。在本发明一个实施例中,线下获取模块610包括:第一获取单元、模拟单元、第二获取单元和第三获取单元。第一获取单元获取网页的DOM树样式,模拟单元对具有鼠标事件的DOM树上的节点模拟鼠标事件,第二获取单元获取模拟鼠标事件后DOM树样式的变化,第三获取单元根据DOM树样式的变化获取网页上的第一控件及第一控件操纵的第一内容节点。第一内容节点是无法正常工作的第一控件所操作的DOM节点。
输出模块620用于将节点以pattern和xpath的形式输出到模板文件。
线上载入模块630用于线上程序载入输出模块620生成的模板文件。识别模块640用于当用户访问的网页包括模板文件中的pattern和xpath时,识别并标注该网页中的第一控件及第一控件操纵的第一内容节点。
替换模块650用于通过重写脚本来生成第二控件以替换所述第一控件。
在本发明的一个实施例中,如图4所示,转码时实现控件替换的装置还包括:增加模块660,增加模块660用于向第二控件操纵的第二内容节点增加样式和布局信息。向第二内容节点增加的样式和布局信息,应当与第一内容节点对应的样式与布局信息相对应,重写之后,节点发生了变化,但之前的样式会保存下来,通过增加样式和布局信息将之前保存的样式增加到重写之后的新节点上。
根据本发明实施例的转码时实现控件替换的装置,在用户通过移动终端访问包括javascript、ajax等脚本的网页时,对不能正常工作的控件进行转码和重写,以避免网页内容因控件不能正常控件而丢失,并且保持了与原网页控件一致的布局,为用户提供了便利。
流程图中或在此以其他方式描述的任何过程或方法描述可以被理解为,表示包括一个或更多个用于实现特定逻辑功能或过程的步骤的可执行指令的代码的模块、片段或部分,并且本发明的优选实施方式的范围包括另外的实现,其中可以不按所示出或讨论的顺序,包括根据所涉及的功能按基本同时的方式或按相反的顺序,来执行功能,这应被本发明的实施例所属技术领域的技术人员所理解。
在流程图中表示或在此以其他方式描述的逻辑和/或步骤,例如,可以被认为是用于实现逻辑功能的可执行指令的定序列表,可以具体实现在任何计算机可读介质中,以供指令执行***、装置或设备(如基于计算机的***、包括处理器的***或其他可以从指令执行***、装置或设备取指令并执行指令的***)使用,或结合这些指令执行***、装置或设备而使用。就本说明书而言,"计算机可读介质"可以是任何可以包含、存储、通信、传播或传输程序以供指令执行***、装置或设备或结合这些指令执行***、装置或设备而使用的装置。计算机可读介质的更具体的示例(非穷尽性列表)包括以下:具有一个或多个布线的电连接部(电子装置),便携式计算机盘盒(磁装置),随机存取存储器(RAM),只读存储器(ROM),可擦除可编辑只读存储器(EPROM或闪速存储器),光纤装置,以及便携式光盘只读存储器(CDROM)。另外,计算机可读介质甚至可以是可在其上打印所述程序的纸或其他合适的介质,因为可以例如通过对纸或其他介质进行光学扫描,接着进行编辑、解译或必要时以其他合适方式进行处理来以电子方式获得所述程序,然后将其存储在计算机存储器中。
应当理解,本发明的各部分可以用硬件、软件、固件或它们的组合来实现。在上述实施方式中,多个步骤或方法可以用存储在存储器中且由合适的指令执行***执行的软件或固件来实现。例如,如果用硬件来实现,和在另一实施方式中一样,可用本领域公知的下列技术中的任一项或他们的组合来实现:具有用于对数据信号实现逻辑功能的逻辑门电路的离散逻辑电路,具有合适的组合逻辑门电路的专用集成电路,可编程门阵列(PGA),现场可编程门阵列(FPGA)等。
本技术领域的普通技术人员可以理解实现上述实施例方法携带的全部或部分步骤是可以通过程序来指令相关的硬件完成,所述的程序可以存储于一种计算机可读存储介质中,该程序在执行时,包括方法实施例的步骤之一或其组合。
此外,在本发明各个实施例中的各功能单元可以集成在一个处理模块中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个模块中。上述集成的模块既可以采用硬件的形式实现,也可以采用软件功能模块的形式实现。所述集成的模块如果以软件功能模块的形式实现并作为独立的产品销售或使用时,也可以存储在一个计算机可读取存储介质中。
在本说明书的描述中,参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中,对上述术语的示意性表述不一定指的是相同的实施例或示例。而且,描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。
尽管上面已经示出和描述了本发明的实施例,可以理解的是,上述实施例是示例性的,不能理解为对本发明的限制,本领域的普通技术人员在不脱离本发明的原理和宗旨的情况下在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。
Claims (6)
1.一种转码时实现控件替换的方法,其特征在于,包括以下步骤:
线下获取网页上的第一控件及所述第一控件操纵的第一内容节点,其中,获取网页的DOM树样式,对具有鼠标事件的DOM树上的节点模拟鼠标事件,并获取模拟鼠标事件后所述DOM树样式的变化,以及根据所述变化获取所述网页上的第一控件及所述第一控件操纵的第一内容节点;
将所述第一内容节点以pattern和xpath的形式输出到模板文件;
线上载入所述模板文件;
当用户访问的网页包括所述模板文件中的所述pattern和xpath时,识别并标注所述网页的第一控件及所述第一控件操纵的第一内容节点;
通过重写脚本来生成第二控件以替换所述第一控件。
2.根据权利要求1所述的方法,其特征在于,进一步包括步骤:
向所述第二控件操纵的第二内容节点增加样式和布局信息。
3.根据权利要求2所述的方法,其特征在于,所述样式和布局信息与所述第一内容节点的样式和布局信息对应。
4.一种转码时实现控件替换的装置,其特征在于,包括:
线下获取模块,所述线下获取模块用于线下获取网页上的第一控件及所述第一控件操纵的第一内容节点,其中,所述线下获取模块包括第一获取单元,所述第一获取单元用于获取网页的DOM树样式;模拟单元,所述模拟单元用于对具有鼠标事件的DOM树上的节点模拟鼠标事件;第二获取单元,所述第二获取单元用于获取模拟鼠标事件后所述DOM树样式的变化;第三获取单元,所述第三获取单元用于根据所述变化获取所述网页上的第一控件及所述第一控件操纵的第一内容节点;
输出模块,所述输出模块用于将所述节点以pattern和xpath的形式输出到模板文件;
线上载入模块,所述线上载入模块用于线上载入所述模板文件;
识别模块,所述识别模块用于当用户访问的网页包括所述模板文件中的所述pattern和xpath时,识别并标注所述网页的第一控件及所述第一控件操纵的第一内容节点;
替换模块,所述替换模块用于通过重写脚本来生成第二控件以替换所述第一控件。
5.根据权利要求4所述的装置,其特征在于,进一步包括:
增加模块,所述增加模块用于向所述第二控件操纵的第二内容节点增加样式和布局信息。
6.根据权利要求5所述的装置,其特征在于,所述样式和布局信息与所述第一内容节点的样式和布局信息对应。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201310182545.4A CN103226475B (zh) | 2013-05-16 | 2013-05-16 | 转码时实现控件替换的方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201310182545.4A CN103226475B (zh) | 2013-05-16 | 2013-05-16 | 转码时实现控件替换的方法及装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN103226475A CN103226475A (zh) | 2013-07-31 |
CN103226475B true CN103226475B (zh) | 2016-03-16 |
Family
ID=48836940
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201310182545.4A Active CN103226475B (zh) | 2013-05-16 | 2013-05-16 | 转码时实现控件替换的方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN103226475B (zh) |
Families Citing this family (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103870546B (zh) * | 2014-02-26 | 2017-03-01 | 百度在线网络技术(北京)有限公司 | 转码后线上线下环境页面对比的分析方法和设备 |
CN105528369B (zh) * | 2014-09-30 | 2019-03-15 | 优视科技有限公司 | 网页转码方法、装置以及服务器 |
CN105022806B (zh) * | 2015-07-03 | 2018-08-10 | 厦门二五八集团有限公司 | 基于翻译模板的互联网网页建构移动页面的方法与*** |
CN111221513B (zh) * | 2020-01-03 | 2023-04-18 | 北京字节跳动网络技术有限公司 | 一种调整层叠样式表的方法、装置、介质和电子设备 |
Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102622351A (zh) * | 2011-01-26 | 2012-08-01 | 腾讯科技(深圳)有限公司 | 转换网络页面类型的方法、装置和*** |
CN102750281A (zh) * | 2011-04-19 | 2012-10-24 | 腾讯科技(深圳)有限公司 | 一种浏览器的脚本处理方法和*** |
-
2013
- 2013-05-16 CN CN201310182545.4A patent/CN103226475B/zh active Active
Patent Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102622351A (zh) * | 2011-01-26 | 2012-08-01 | 腾讯科技(深圳)有限公司 | 转换网络页面类型的方法、装置和*** |
CN102750281A (zh) * | 2011-04-19 | 2012-10-24 | 腾讯科技(深圳)有限公司 | 一种浏览器的脚本处理方法和*** |
Non-Patent Citations (1)
Title |
---|
《移动终端网页转换***的设计与实现》;邱鹏;《中国优秀硕士学位论文全文数据库 信息科技辑》;20121015;第1-66页 * |
Also Published As
Publication number | Publication date |
---|---|
CN103226475A (zh) | 2013-07-31 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US11182535B2 (en) | Configuring a page for drag and drop arrangement of content artifacts in a page development tool | |
US8370750B2 (en) | Technology for generating service program | |
CN110083790A (zh) | 页面编辑方法、页面输出方法、装置、计算机设备及介质 | |
US20080195626A1 (en) | Data Processing Device,Document Processing Device,Data Relay Device,Data Processing Method ,and Data Relay Method | |
EP1818835A1 (en) | Document processing device, and document processing method | |
EP1821185A1 (en) | Data processing device and data processing method | |
US20100115394A1 (en) | Document processing device and document processing method | |
US20080040588A1 (en) | Data Processing Device and Data Processing Method | |
US10049095B2 (en) | In-context editing of output presentations via automatic pattern detection | |
US20080133563A1 (en) | Data Processing Device And Data Processing Method | |
US20080209572A1 (en) | Data Processing System, Data Processing Method, and Management Server | |
US20080046809A1 (en) | Data Processing Device and Data Processing Method | |
US20080010588A1 (en) | Document Processing Device and Document Processing Method | |
CN103620586A (zh) | 将源代码链接到运行元素 | |
CN103226475B (zh) | 转码时实现控件替换的方法及装置 | |
US20090077462A1 (en) | Document processing device and document processing method | |
CN104798067A (zh) | Web服务器***、辞典***、辞典调用方法、画面控件显示方法以及演示应用生成方法 | |
US20080256092A1 (en) | Data Processing Device and Data Processing Method | |
CN110543298A (zh) | 网页样式生成方法及装置、网页生成方法及装置 | |
US10956658B2 (en) | Digital content editing of a document object model (DOM) based on object model comparison | |
CN111078217A (zh) | 脑图生成方法、装置和计算机可读存储介质 | |
US20080250311A1 (en) | Document Processing Device, and Document Processing Method | |
US20080208790A1 (en) | Document Processing Device, and Document Processing Method | |
US7802181B2 (en) | Document processing device and document processing method | |
US20080320412A1 (en) | Document Processing Device and Document Processing Method |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
C14 | Grant of patent or utility model | ||
GR01 | Patent grant |