Question

为非JS启用和启用JS的页面开发Web页面的最佳实践是什么？我正在使用JSP / JSTL作为视图技术开发Spring MVC Web应用程序。

我的工作方式是在其中创建一个完整的网页（带有“html”，“head”等）标签。这适用于所有浏览器。我的整个应用程序（无论多么丑陋）都可以使用JS。

每个页面中还包含一些用于美化页面的jQuery脚本，通常将顶级“div”转换为制表符，其他div转换为对话框等.JE“劫持”底层HTML。我的JS劫持了链接和按钮，使用AJAX调用将内容加载到正确的对话框或制表符div中。

这一切都很好用，我喜欢这个架构，但我添加了一个优化，以便AJAX请求附加一个“contentOnly”参数;这是由Spring MVC视图选择的，它有条件地忽略了“head”等 - 即它只呈现AJAX版本想要的真实内容。它只是感觉笨重。

我知道我可以加载整个页面并丢弃外部位，但加载所有相关的CSS和JS文件似乎效率不高。

我的问题是：有没有更好的方法来编写这种条件格式，我应该使用不同的视图技术还是别的东西，比如Velocity或FreeMarker或Grails使用的其他东西？

我的条件示例： -

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<c:if test="${param.contentOnly == null}">
<!DOCTYPE html>
<html>
<head>
    <%@ include file="_stylesAndScripts.jsp"%>
    <title>My App Title</title>
</head>

<body>
    <%@ include file="_header.jsp"%>
    <%@ include file="_menu.jsp"%>
</c:if>
    <div id="leadListPanel" class="contentPanel">
        <h1>My App Title</h1>
        <p>The time on the server is ${serverTime}.</p>

        <table id="leadTable" class="list">
                    ... rest of content...

<c:if test="${param.contentOnly == null}">

    <%@ include file="_footer.jsp"%>
</body>
</html>
</c:if>

Answer 1

几年前我和Freemarker使用过这种方法，我不知道更好的方法。

您可以做的是为这些条件创建JSP标记，以便它们看起来更好并隐藏实际的实现。像这样：

<t:NonAjax>
  <!DOCTYPE html>
  <html>
  <head>
    <%@ include file="_stylesAndScripts.jsp"%>
    <title>My App Title</title>
  </head>
  <body>
    <%@ include file="_header.jsp"%>
    <%@ include file="_menu.jsp"%>
</t:NonAjax>
<div id="leadListPanel" class="contentPanel">
    <h1>My App Title</h1>
    <p>The time on the server is ${serverTime}.</p>

    <table id="leadTable" class="list">
                ... rest of content...

<t:NonAjax>
  <%@ include file="_footer.jsp"%>
  </body>
  </html>
</t:NonAjax>

Answer 2

您需要反过来包含文件。

/WEB-INF/template.jsp

<!DOCTYPE html>
<html>
    <head>
        <%@ include file="_stylesAndScripts.jsp"%>
        <title>My App Title</title>
    </head>
    <body>
        <%@ include file="_header.jsp"%>
        <%@ include file="_menu.jsp"%>
        <jsp:include page="${page}.jsp" />
        <%@ include file="_footer.jsp"%>
    </body>
</html>

leads.jsp

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<div id="leadListPanel" class="contentPanel">
    <h1>My App Title</h1>
    <p>The time on the server is ${serverTime}.</p>

    <table id="leadTable" class="list">
                ... rest of content...

创建一个控制器，根据特定的请求网址将leads设置为${page}变量，然后转发到template.jsp。由于我不做Spring，我无法详细回答如何用Spring实现它。但是下面的基本JSP / Servlet启动示例应该给出一般的想法：

@WebServlet(urlPatterns={"/pages/*"})
public class TemplateServlet extends HttpServlet {

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String page = request.getPathInfo();
        // .. Do some other preprocessing if necessary .. and then:
        request.setAttribute("page", page);
        request.getRequestDispatcher("/WEB-INF/template.jsp").forward(request, response);
    }

}

以http://example.com/contextname/pages/leads方式调用它，以显示包含leads.jsp的模板。最后，您应该能够独立调用http://example.com/contextname/leads.jsp以获取唯一的模板内容。

提供静态和AJAX页面内容的最佳方式是什么？

2 个答案: