8.3.7 技术难点详解

8.3.7  技术难点详解

1．DOM技术的应用

本例中多个页面均借助Ajax技术实现了页面的局部动态更新，解决的方式是借助DOM对HTML文档进行操作，以控制动态表格中行的增加或者减少，对应的核心代码如下：

function addOneArticle(id,name,time) {
var row = document.createElement("tr");
row.setAttribute("id", id);
var cell = document.createElement("td");
cell.appendChild(document.createTextNode(name));
row.appendChild(cell);

cell = document.createElement("td");
cell.appendChild(document.createTextNode(time));
row.appendChild(cell);

var deleteButton = document.createElement("input");
deleteButton.setAttribute("type", "button");
deleteButton.setAttribute("value", "删除");
deleteButton.onclick = function () { deleteArticle(id); };
cell = document.createElement("td");
cell.appendChild(deleteButton);
row.appendChild(cell);

              document.getElementById("articleList").appendChild(row);
}

2．文件上传功能的实现

本模块需要实现图片文件上传到服务器的功能，在具体实现时，在对应表单的相关标记中要注意以下两点。

<form enctype="multipart/form-data" method="post" action="saveLogo">
<input type="file" name="image">

在具体获取文件信息时，借助了对应组件来达到目的，具体核心代码如下：

String imageName = null;
SmartUpload mySmartUpload = new SmartUpload();
try {
// 初始化
mySmartUpload.initialize(config,request,response);
// 上载
mySmartUpload.upload();
// 保存上载文件到指定目录
mySmartUpload.save("\\images");
imageName = mySmartUpload.getFiles().getFile(0).getFileName();

} catch (Exception e){
System.out.println(e);
}