`
hatedance
  • 浏览: 59697 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

构造服务器端的DOM

阅读更多
今天突然想到WEB开发还有一种方式似乎还没有人搞过。就是把客户端的DOM搬到server端,即java版的DOM。然后,就像ORM把数据库映射到java里。咱来个Object Markup Mapping(OMM)。然后,就像用jquery之类的办法去修改页面,得到需要的动态页面。

我详细一点说,就是:
先有一个静态的html文件。
然后有一个工具,把html解析起来,得到内存中的DOM。
然后,根据类似jquery的selector的思路,去调整页面的动态部分。
最后,这个DOM自然可以随时输出对应的html文本,返回到客户端。

如果由此基础上继续前进,很可能引入比DOM更高级的界面组件,最后跟JSF殊途同归。

以上是我脑子里昙花一现的想法,欢迎大家拍砖。
分享到:
评论
8 楼 guooscar 2009-04-22  
hatedance 写道
跟GWT,JSF之类的组件模型有一个问题,就是有时候过于高度抽象,粒度太粗。虽然方便了程序员进行界面设计,但是web设计师却无法参与了。去问问asp.net程序员就知道了。web设计师最喜欢的肯定就是在dreamweaver里作纯html.

而DOM的粒度却是够细。


如果有更好的工具“web设计师”应该更喜欢拖拖画画,所以要玩就玩的彻底点,极端点,看看ECHO2 jseamless
那样的东西才是真正的server端UI组件,不过性能就可想而知了,玩具而已
7 楼 hatedance 2009-04-22  
跟GWT,JSF之类的组件模型有一个问题,就是有时候过于高度抽象,粒度太粗。虽然方便了程序员进行界面设计,但是web设计师却无法参与了。去问问asp.net程序员就知道了。web设计师最喜欢的肯定就是在dreamweaver里作纯html.

而DOM的粒度却是够细。
6 楼 luolonghao 2009-04-21  
直接用GWT吧
5 楼 抛出异常的爱 2009-04-21  
这样子的东西么
有人正在尝试用这种模式开发
不知道有什么问题
<head>
<script>
//由<iterater>生成的数据
</script>
<script>
//树的生成代码
//表格子生成代码
</script>
<srcipt>
//动态加载,初始加载等代码
//jquery把数据把对应的数据绑到对应的格子中去
</script>
</head>
4 楼 hatedance 2009-04-21  
liujunsong 写道
为啥要在服务器上干这事情?
难道是因为服务器太闲了,所以找点事情给他干?


这么做服务器只会更忙,呵呵。

理由之一就是如果你认可ORM,那么应该也会认可OMM。让程序员告别SQL和HTML对喜欢OO的程序员应该是件好事。
原本给一个文本框设值,在jsp是这样的:
<input id="foo" name="foo" value="${bar}">


现在换种方式:
public void onload(){
HtmlDom dom = xxUtil.parse("xx.html");
...
HtmlInput input = (HtmlInput)dom.getElementById("foo");
input.setValue=bar;
...
}


另外,做页面的web设计师就不必考虑jstl,或者structs的tag了。他做的就是标准的html页面。
3 楼 liujunsong 2009-04-20  
为啥要在服务器上干这事情?
难道是因为服务器太闲了,所以找点事情给他干?
2 楼 hatedance 2009-04-20  
楼上的,好像跟我想的不是很一致啊。你这是把select的UI render出来吧?没错,web组件肯定要有这个功能,但这不是重点。
1 楼 shiren1118 2009-04-20  
hatedance 写道
今天突然想到WEB开发还有一种方式似乎还没有人搞过。就是把客户端的DOM搬到server端,即java版的DOM。然后,就像ORM把数据库映射到java里。咱来个Object Markup Mapping(OMM)。然后,就像用jquery之类的办法去修改页面,得到需要的动态页面。

我详细一点说,就是:
先有一个静态的html文件。
然后有一个工具,把html解析起来,得到内存中的DOM。
然后,根据类似jquery的selector的思路,去调整页面的动态部分。
最后,这个DOM自然可以随时输出对应的html文本,返回到客户端。

如果由此基础上继续前进,很可能引入比DOM更高级的界面组件,最后跟JSF殊途同归。

以上是我脑子里昙花一现的想法,欢迎大家拍砖。



public static String getSelectUI(List list, String selectName,
String selectId, String showName, String showValue) {
/**
* <select name="select" id="select"> <option value=""></option>
* </select>
*/
StringBuilder sb = new StringBuilder();
sb.append("<select name=" + selectName + " id=" + selectId + ">");
for (int i = 0; i < list.size(); i++) {
sb.append(" <option value="
+ returnGetFieldValue(list.get(i), showValue) + ">"
+ returnGetFieldValue(list.get(i), showName) + "</option>");
}
sb.append("</select>");
return sb.toString();
}

也不过是此类玩具

相关推荐

    ssdom.js:服务器端 DOM 实现

    ssdom.js:服务器端 DOM 实现概述ssdom.js 是一种旨在用于 Web 服务器的 DOM 实现。 典型的用例是动态构造一些 HTML 文档,以便对其进行序列化并将其发送到 Web 浏览器。目标提供基本 DOM 操作函数和属性的实现能够...

    虚拟DOM的实现

    - 跨平台:虚拟DOM可以用于Web、移动应用甚至服务器端渲染,因为它不依赖于实际的DOM。 3. 虚拟DOM的实现: - 创建虚拟DOM节点:首先,我们需要定义一个函数或者类来表示虚拟DOM节点,它包含元素类型(如div、...

    Web应用安全:DOM型XSS.pptx

    反射型XSS和存储型XSS都发生在服务器端,而DOM型XSS主要发生在客户端。在反射型XSS中,恶意代码作为参数包含在URL中,当用户点击链接时,这些参数被服务器处理并返回到页面,然后执行。存储型XSS则更严重,因为它...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

     11.3 服务器端API:需要代理脚本   11.3.1 通过Basecamp构建集成的To-Do列表   11.3.2 通过Flickr取得个性头像   11.4 小结   第12章 案例研究:用DOM设计选择列表   12.1 经典的感觉   12.2 ...

    Web应用安全:DOM型XSS习题(实验习题).docx

    这意味着攻击者可以通过构造特定的URL参数来触发DOM型XSS,而这些参数不需要发送到服务器端即可执行。 5. **绕过WAF和服务器检测** - 在DOM型XSS攻击中,由于恶意脚本不会被发送到服务器,因此可以有效地绕过**...

    使用Fusion Charts制作报表(dom4j生成XML)

    其工作原理是通过JavaScript与服务器端交互,接收服务器返回的结构化数据(如XML或JSON),然后在客户端动态绘制出相应的图表。 dom4j是一个强大的Java XML处理库,它简化了XML文档的读写操作。在本场景中,我们将...

    实现 Virtual DOM 下的一个 VNode 节点(2).md

    Node.js环境下虽然没有DOM,但可以使用Virtual DOM来做服务器端渲染(SSR)等操作。 ### 总结 VNode作为Virtual DOM的一个节点,它以JavaScript对象的形式存在,提供了创建、更新和维护DOM的高效方式。通过封装好...

    DOM-XSS漏洞的挖掘与攻击面延伸.pdf

    - **攻击方式:** 攻击者可以通过构造恶意URL,利用`location.hash`或`location.search`中的数据,绕过服务器端的安全检查,在目标页面执行恶意脚本。 - **示例代码:** `javascript:alert(1);` **跳转:** - **...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part3.rar

     11.3 服务器端API:需要代理脚本   11.3.1 通过Basecamp构建集成的To-Do列表   11.3.2 通过Flickr取得个性头像   11.4 小结   第12章 案例研究:用DOM设计选择列表   12.1 经典的感觉   12.2 ...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part2.rar

     11.3 服务器端API:需要代理脚本   11.3.1 通过Basecamp构建集成的To-Do列表   11.3.2 通过Flickr取得个性头像   11.4 小结   第12章 案例研究:用DOM设计选择列表   12.1 经典的感觉   12.2 ...

    Javascript 通过json自动生成Dom的代码

    这种技术在很多情况下都非常有用,例如当需要根据服务器端返回的数据动态生成页面内容时,或者在构建模板引擎以及实现单页应用中。通过对JSON数据的解析和操作,我们可以在客户端以声明式的方式构建页面,极大地提高...

    田靖宇-day211

    DOM-XSS的利用步骤类似于反射型XSS,但关键区别在于构造的URL参数无需经过服务器,这使得攻击者能够绕过服务器端的安全检测。防护DOM-XSS的关键在于对用户输入的数据进行严格的编码和验证,避免恶意脚本的执行。常见...

    Java实现的Http服务器

    服务器端通过创建ServerSocket实例来监听指定端口,当客户端请求到达时,ServerSocket会创建一个Socket实例,代表了与客户端的连接。 其次,HTTP协议的理解至关重要。HTTP是超文本传输协议,用于从Web服务器向...

    基于前后端分离构造的图书馆管理系统

    【标题】"基于前后端分离构造的图书馆管理系统"是一个现代软件开发中的常见实践,它将应用程序的用户界面(前端)与服务器逻辑(后端)进行解耦,从而提高开发效率和用户体验。在这个系统中,前端负责展示数据和接收...

    AJAX实现的动态下拉列表框例子

    在网页设计中,动态下拉列表框是一种常见且实用的功能,它能提升用户体验,使得用户在选择时无需刷新页面即可获取更多选项。...开发者需要掌握JavaScript、DOM操作以及服务器端编程技术,才能成功实现这一功能。

    xml-based-message-board-function.rar_基于xml_留言板

    6. **安全性**:考虑到XML注入攻击的可能性,服务器端需要对用户输入进行转义和过滤,防止恶意XML构造。 ### 技术选型与实现细节 在实际开发中,可以选择不同的技术和库来支持XML的处理。例如,对于PHP,可以使用...

    利用Ajax传递Xml文档

    本文将深入探讨如何使用Ajax来传递XML文档,包括创建XML数据、发送请求、处理响应以及服务器端的接收与解析。 #### 创建XML数据 在客户端,首先需要构造XML数据。在给定的代码示例中,`GetAllFormData()`函数负责...

Global site tag (gtag.js) - Google Analytics