否支持用户的输入操作；
[0069]若否，则退出；
[0070]步骤A2，监控文件节点上是否存在关联于用户的新的输入操作的输入数值，并在存在有输入数值时转向步骤A3;
[0071 ]步骤A3，采用输入数值对视图数据进行更新；
[0072]步骤A4，刷新网页，并重新执行步骤S4。
[0073]具体地，本发明的较佳的实施例中，将上述带有预设标签的dom节点分为支持用户的输入操作的dom节点，以及不支持用户的输入操作的dom节点。更进一步地，不支持用户的输入操作的dom节点中，其视图数据是固定的预设值，因此只需要建立视图数据和视图模型的对应关系即可。而支持用户的输入操作的dom节点中，其视图数据为一个变量(例如上文中提到的username)，当使用者输入相应数值时，则该变量会被输入的数值替代，此时需要根据上述对应关系更新视图数据以及对应的视图模型。
[0074]例如，原本作为输入框的dom节点，其视图数据和视图模型的对应关系为Value=username。由于该dom节点支持使用者的输入操作，则当使用者输入“XXX”时，username被XXX所替代，此时视图数据和视图模型的对应关系应该被更新为Value = XXX。因此上述步骤A3中，需要采用输入数值对视图数据进行更新，从而保证上述对应关系是正确的，随后再刷新网页，将根据上述的更新结果重新显示。
[0075]本发明的较佳的实施例中，进一步地，如图3所示，执行步骤A3之前，首先执行下述判断:
[0076]步骤A31，判断输入数值是否与对应的视图数据不同；
[0077]若是，则转向步骤A3;
[0078]若否，则退出。
[0079]上述步骤即判断输入数值是否与本身的视图数据相同的过程。例如，若当前的视图数据为XXX，输入仍然为XXX，则此时不需要更新。
[0080]本发明的较佳的实施例中，如上文中所述，上述视图数据和视图模型的对应关系可能对应于多个dom节点，因此，在上述步骤中，需要通信根据该对应关系同时更新多个dom节点的视图数据，从而保证网页显示的一致性。
[0081]本发明的较佳的实施例中，上述视图数据、视图模型以及对应关系均被保存在系统内存中。
[0082]综上所述，本发明技术方案中，首先在需要进行视图数据和视图模型双向绑定的dom节点上设置具有预设前缀的预设标签。随后扫描得到具有上述预设标签的dom节点并进行解析，得到关联于不同的dom节点的视图数据、视图模型及其对应关系并保存。随后采用视图渲染器，根据对应关系，将视图模型上的具体视图数据进行渲染，使其能够显示在网页页面上。
[0083]本发明的较佳的实施例中，上述方法适用于网页开发的前端。
[0084]本发明的较佳的实施例中，基于上文中所述的网页视图交互处理方法，现提供一种网页视图交互处理系统，其结构具体如图4所示，包括:
[0085]扫描单元I，用于对html文件进行扫描并得到html文件中带有预设标签的文件节占.V，
[0086]解析单元2，连接扫描单元I，用于对所有扫描得到的文件节点进行解析，以得到关联于每个文件节点的视图数据以及对应的视图模型；
[0087]关系建立单元3，连接解析单元2，用于建立关联于每个文件节点的视图数据与视图模型之间的对应关系；
[0088]存储单元4，连接关系建立单元3，用于保存对应关系；进一步地，上述存储单元可以为系统内存。
[0089]渲染单元5，连接存储单元4，用于应用视图渲染器，结合视图数据和对应的视图模型进行渲染，并将渲染结果显示在网页上供使用者查看。
[0090]本发明的较佳的实施例中，如上文中所述，关联于每个文件节点的预设标签包括:[0091 ]关联于每个文件节点的原生标签，以及
[0092]设置于每个原生标签之前的预设前缀。
[0093]本发明的较佳的实施例中，仍然如图4所示，上述系统中还包括:
[0094]判断单元6，连接扫描单元I，用于判断扫描得到的文件节点是否支持用户的输入操作，并输入判断结果；
[0095]监控单元7，连接判断单元6，用于根据判断结果，监控文件节点上是否存在关联于用户的新的输入操作的输入数值，并输出监控结果；
[0096]更新单元8，分别连接监控单元7和存储单元4，用于根据监控结果，采用输入数值对存储单元4中保存的视图数据进行更新；
[0097]刷新单元9，分别连接更新单元8和渲染单元5，用于在更新单元8完成更新后，控制渲染单元5刷新网页，并重新应用视图渲染器，结合视图数据和对应的视图模型进行渲染，并将渲染结果显示在网页上供使用者查看。
[0098]进一步地，本发明的较佳的实施例中，如图5所示，上述更新单元8包括:
[0099]比对模块81，用于比对输入数值是否与对应的视图数据不同，并输出比对结果；
[0100]更新模块82，连接比对模块81，用于根据比对结果，在输入数值与视图数据不同时，采用输入数值对视图数据进行更新。
[0101]以上所述仅为本发明较佳的实施例，并非因此限制本发明的实施方式及保护范围，对于本领域技术人员而言，应当能够意识到凡运用本发明说明书及图示内容所作出的等同替换和显而易见的变化所得到的方案，均应当包含在本发明的保护范围内。
【主权项】
1.一种网页视图交互处理方法，其特征在于，包括: 步骤SI，对html文件进行扫描并得到所述html文件中带有预设标签的文件节点； 步骤S2，对所有扫描得到的所述文件节点进行解析，以得到关联于每个所述文件节点的视图数据以及对应的视图模型； 步骤S3，建立并保存关联于每个所述文件节点的所述视图数据与所述视图模型之间的对应关系； 步骤S4，采用视图渲染器，结合所述视图数据和对应的所述视图模型进行渲染，并将渲染结果显示在网页上供使用者查看。2.如权利要求1所述的网页视图交互处理方法，其特征在于，关联于每个所述文件节点的所述预设标签包括: 关联于每个所述文件节点的原生标签，以及 设置于每个所述原生标签之前的预设前缀。3.如权利要求1所述的网页视图交互处理方法，其特征在于，执行所述步骤S3的同时，执行下述步骤: 步骤Al，判断所述文件节点是否支持用户的输入操作； 若否，则退出； 步骤A2，监控所述文件节点上是否存在关联于用户的新的所述输入操作的输入数值，并在存在有所述输入数值时转向步骤A3; 步骤A3，采用所述输入数值对所述视图数据进行更新； 步骤A4，刷新所述网页，并重新执行所述步骤S4。4.如权利要求3所述的网页视图交互处理方法，其特征在于，执行所述步骤A3之前，首先执行下述判断: 步骤A31，判断所述输入数值是否与对应的所述视图数据不同； 若是，则转向所述步骤A3; 若否，则退出。5.如权利要求1所述的网页视图交互处理方法，其特征在于，所述视图数据、所述视图模型以及所述对应关系被保存在系统内存中。6.—种网页视图交互处理系统，其特征在于，包括: 扫描单元，用于对html文件进行扫描并得到所述html文件中带有预设标签的文件节占.V， 解析单元，连接所述扫描单元，用于对所有扫描得到的所述文件节点进行解析，以得到关联于每个所述文件节点的视图数据以及对应的视图模型； 关系建立单元，连接所述解析单元，用于建立关联于每个所述文件节点的所述视图数据与所述视图模型之间的对应关系； 存储单元，连接所述关系建立单元，用于保存所述对应关系； 渲染单元，连接所述存储单元，用于应用视图渲染器，结合所述视图数据和对应的所述视图模型进行渲染，并将渲染结果显示在网页上供使用者查看。7.如权利要求6所述的网页视图交互处理系统，其特征在于，关联于每个所述文件节点的所述预设标签包括: 关联于每个所述文件节点的原生标签，以及 设置于每个所述原生标签之前的预设前缀。8.如权利要求6所述的网页视图交互处理系统，其特征在于，还包括: 判断单元，连接所述扫描单元，用于判断扫描得到的所述文件节点是否支持用户的输入操作，并输入判断结果； 监控单元，连接判断单元，用于根据所述判断结果，监控所述文件节点上是否存在关联于用户的新的所述输入操作的输入数值，并输出监控结果； 更新单元，分别连接所述监控单元和所述存储单元，用于根据所述监控结果，采用所述输入数值对所述存储单元中保存的所述视图数据进行更新； 刷新单元，分别连接所述更新单元和所述渲染单元，用于在所述更新单元完成更新后，控制所述渲染单元刷新所述网页，并重新应用视图渲染器，结合所述视图数据和对应的所述视图模型进行渲染，并将渲染结果显示在网页上供使用者查看。9.如权利要求8所述的网页视图交互处理系统，其特征在于，所述更新单元包括: 比对模块，用于比对所述输入数值是否与对应的所述视图数据不同，并输出比对结果； 更新模块，连接所述比对模块，用于根据所述比对结果，在所述输入数值与所述视图数据不同时，采用所述输入数值对所述视图数据进行更新。10.如权利要求6所述的网页视图交互处理系统，其特征在于，所述存储单元为系统内存。
【专利摘要】本发明公开了一种网页视图交互处理方法及系统，属于网页处理技术领域；方法包括：步骤S1，对html文件进行扫描并得到html文件中带有预设标签的文件节点；步骤S2，对所有扫描得到的文件节点进行解析，以得到关联于每个文件节点的视图数据以及对应的视图模型；步骤S3，建立并保存关联于每个文件节点的视图数据与视图模型之间的对应关系；步骤S4，采用视图渲染器，结合视图数据和对应的视图模型进行渲染，并将渲染结果显示在网页上供使用者查看。系统包括：扫描单元、解析单元、关系建立单元、存储单元以及渲染单元。上述技术方案的有益效果是：降低网页代码维护的复杂程度，减少网页相关工具中不必要的功能模块，便于开发人员理解和掌握。
【IPC分类】G06F17/30
【公开号】CN105631011
【申请号】CN201511005078
【发明人】温涛
【申请人】上海瀚之友信息技术服务有限公司
【公开日】2016年6月1日
【申请日】2015年12月28日