javascript中的自定义属性的应用--避免频繁访问数据库

来源：互联网发布：大连矩阵科技有限公司编辑：程序博客网时间：2024/05/10 19:26

在WEB应用程序中，经常需要将数据从数据库中取出来，填充到HTML控件中，然后再存回数据库。

如果数据并未改动，仍然占用网络资源存入数据库，则对网络资源是一种浪费，当页面数据很多和网络访问量很大时，就会形成性能的瓶颈。如何能在提交数据前进行判断呢？

一种方法是建隐藏控件或定义全局变量，这种情况适用于控件很少时，若一个表单页面有数十项时，建隐藏控件太多反而降低性能，定义全局变量不容易记忆。

另一种方法，就是在原有控件中增加自定义属性，这样，既能避免逻辑复杂，又能节省网络流量。

如页面中有一文本框:

在页面的onload事件中加入如下代码：

function initvalue()

{

var xm = "张三"; //假设从数据库中取得

var obj = document.getElementById("txtName");

obj.value = xm;

obj.setAttribute("originValue",xm);

}

页面添加一按钮,其点击事件onclick如下:

function upload()

{

var obj = document.getElementById("txtName");

var xm = obj.value;

var origin_xm = getCustomAttributeValue(obj,"originValue");

if(xm == origin_xm)

{

alert("值未变,不需存回数据库");

}

else

{

alert("值已发生改变,可以写回! 初始值为:" + origin_xm + " 当前值为:" + xm);

//写回数据库...

//...

}

代码如下:

<html>

<head>

<title>自定义属性应用</title>

function initvalue()

{

var xm = "张三"; //假设从数据库中取得

var obj = document.getElementById("txtName");

obj.value = xm;

obj.setAttribute("originValue",xm);

}

function upload()

{

var obj = document.getElementById("txtName");

var xm = obj.value;

var origin_xm = getCustomAttributeValue(obj,"originValue");

if(xm == origin_xm)

{

alert("值未变,不需存回数据库");

}

else

{

alert("值已发生改变,可以写回! 初始值为:" + origin_xm + " 当前值为:" + xm);

//写回数据库...

//...

}

function getCustomAttributeValue(obj,attr)

{

if(obj.attributes[attr])

return obj.attributes[attr].nodeValue;

else

return null;

}

function setCustomAttributeValue(obj,attr,value)

{

if(value != null)

{

obj.attributes[attr].nodeValue = value;

}

</script>

</head>

</body>

</html>

源代码:点此进入下载页面
博客园下载地址:http://www.cnblogs.com/Files/redleaf1995/jsSaveDB.rar