1. tar -xvzf db2exc_970_LNX_x86.tar.gz
   tar -xvzf db2exc_nlpack_970_LNX_x86.tar.gz
   网上说， 可以解压到同一个目录里面， 自动整合， 这个我没有试验， 今天晚上试试。
2. 这个时候， 如果执行db2setup的话， 会报少一个包. The required library file libaio.so.1 is not found on the system.
   Ubuntu的好处体现出来了，sudo apt-get install libaio1 安装缺少的包。
   其实我第一次安装的是libaio， apt-get提示我说不可用， 可以用libaio1替代。
   安装完依赖包， 就可以用db2setup来安装了。 因为Ubuntu一般不允许root登陆， 为了方便， 我用我的用户安装的。 用root权限安装的话， 会安装到/opt/ibm/db2下面， 用普通用户的话， 会安装的用户目录。
   
   嗯， 高手也可以用db2-install命令行模式安装。 其实期间没有交互信息的， 哪个都行。
   
   安装的过程， 就不细说了， 一路next过来的。
3. 安装结束以后， 得记着， 要运行安装目录下的db2profile， 添加环境变量。. /home/richar/sqllib/db2profile 自己看清楚目录哦。
4. 执行结束， 运行db2start命令， 它报给我个错：
   SQL1220NThedatabasemanagersharedmemorysetcannotbeallocated.
   
   网上搜了些资料， 说是共享缓存不足， 具体原理我也不清楚了。 用sysctl kernel.shmmax命令查看了共享内存。kernel.shmmax=33554432(32MB), 设置成256M
   echo 268435456 > /proc/sys/kernel/shmmax
   
   之后再次执行db2start, 启动成功。

本文出自 “立子” 博客，请务必保留此出处http://leaze.blog.51cto.com/83088/195583

知道了一张图片的地址，需要把它在一个固定大小的html容器（可以是div等）里边显示出来，最重要的当然是需要知道这张即将显示的图片的宽和高，然后再结合容器的宽和高，按照一定的缩放比例使图片显示出来。因此，实现图片预加载就成为图片浏览器的核心功能了。

做过图片翻转效果的朋友其实都知道，要让图片轮换的时候不出现等待，最好是先让图片下载到本地，让浏览器缓存起来。这时，一般都会用到js里边的Image对象。一般的手段无非这样：
function preLoadImg(url) {
  var img = new Image();
  img.src = url;
}
通过调用preLoadImg函数，传入图片的url，就能使图片预先下载下来了。实际上，这里用到的预下载功能也和这基本一致。图片预下载下来后，通过 img的width和height属性，就能知道图片的宽和高了。但是需要考虑到，在做图片浏览器功能时，图片都是实时显示的。比如你点了显示的按钮，这个时候才会调用上边类似的代码来加载图片。因此，如果你直接用img.width的时候，图片还没有完全下载下来。因此，需要用一些异步的方法，等到图片下载完毕的时候才会再对img的width和height进行调用。

实现这样的异步方法实际上不难，图片的下载完毕事件也很简单，就是简单的onload事件。因此，我们可以写出下面的代码：
function loadImage(url, callback) {
  var img = new Image();
  img.src = url;

  img.onload = function(){ //图片下载完毕时异步调用callback函数。
    callback.call(img);   // 将callback函数this指针切换为img。
  };
}

好了，再来写一个测试用例。
function imgLoaded(){
  alert(this.width);
}
<input type="button" value="loadImage" onclick="loadImage('aaa.jpg',imgLoaded)"/>

在firefox中测试一下，发现不错，果然和预想的效果一样，在图片下载后，就会弹出图片的宽度来。无论点击多少次或者刷新结果都一样。

不过，做到这一步，先别高兴太早——还需要考虑一下浏览器的兼容性，于是，赶紧到ie里边测试一下。没错，同样弹出了图片的宽度。但是，再点击load的时候，情况就不一样了，什么反应都没有了。刷新一下，也同样如此。

经过对多个浏览器版本的测试，发现ie6、opera都会这样，而firefox和safari则表现正常。其实，原因也挺简单的，就是因为浏览器的缓存了。当图片加载过一次以后，如果再有对该图片的请求时，由于浏览器已经缓存住这张图片了，不会再发起一次新的请求，而是直接从缓存中加载过来。对于 firefox和safari，它们视图使这两种加载方式对用户透明，同样会引起图片的onload事件，而ie和opera则忽略了这种同一性，不会引起图片的onload事件，因此上边的代码在它们里边不能得以实现效果。

怎么办呢？最好的情况是Image可以有一个状态值表明它是否已经载入成功了。从缓存加载的时候，因为不需要等待，这个状态值就直接是表明已经下载了，而从http请求加载时，因为需要等待下载，这个值显示为未完成。这样的话，就可以搞定了。

经过一些分析，终于发现一个为各个浏览器所兼容的Image的属性——complete。所以，在图片onload事件之前先对这个值做一下判断即可。最后，代码变成如下的样子：
function loadImage(url, callback) {
    var img = new Image(); //创建一个Image对象，实现图片的预下载
    img.src = url;
  
    if (img.complete) { // 如果图片已经存在于浏览器缓存，直接调用回调函数
        callback.call(img);
        return; // 直接返回，不用再处理onload事件
    }

    img.onload = function () { //图片下载完毕时异步调用callback函数。
        callback.call(img);//将回调函数的this替换为Image对象
    };
};
经过这么一番折腾，总算是让各个浏览器都能满足我们的目标了。虽然代码很简单，但是却把图片浏览器中最核心的问题解决掉了，接下来你所要做的，仅仅是图片如何呈现的问题了。

  //给一级节点添加子子节点
   addChildrenNodes(mainClassNode,resultNodes);
  
  //缓存一级菜单选择的默认值
  var mainClassTxtNode = document.getElementById("mainClassTxt");
  var mainClassBtnNode = document.getElementById("mainClassBtn");
  mainClassTxtNode.setAttribute("tempId",1);
  //设置下拉菜单绝对位置
  setDivAbsulotePosition(mainClassNode,mainClassTxtNode);
  //设置Btn的绝对位置
  //mainClassBtnNode.style.position = "absolute";
  //setBtnAbsulotePosition(mainClassBtnNode,mainClassTxtNode);
 
  //一级菜单
  mainClassNode.attachEvent(onblur,hideMenuItem);
  //二级菜单
  var subClassNode = document.getElementById("subClass");
  var subClassBtnNode = document.getElementById("subClassBtn");
  var subClassTxtNode = document.getElementById("subClassTxt");
  setDivAbsulotePosition(subClassNode,subClassTxtNode);
  //设置Btn的绝对位置
  //subClassBtnNode.style.position = "absolute";
  //setBtnAbsulotePosition(subClassBtnNode,subClassTxtNode);
  
  //三级菜单
  var itemClassNode = document.getElementById("itemClass");
  var itemClassBtnNode = document.getElementById("itemClassBtn");
  var itemClassTxtNode = document.getElementById("itemClassTxt");
  setDivAbsulotePosition(itemClassNode,itemClassTxtNode);
  //设置Btn的绝对位置
  //itemClassBtnNode.style.position = "absolute";
  //setBtnAbsulotePosition(itemClassBtnNode,itemClassTxtNode);
 }

 
 //—————更新下拉菜单—————
 function updateSelectMenu() {
  
  //被选择节点Id
  var nodeId = event.srcElement.getAttribute("id");
  //被选择节点文本子节点名
  var nodeName = event.srcElement.title != null > 5 ? event.srcElement.title : event.srcElement.childNodes.item(0).nodeValue;
  //被选择节点父节点
  var parentNode = event.srcElement.parentElement;
  //被选择节点父节点Id
  var parentNodeId = parentNode.getAttribute("id");
  //给文本框赋被选择值
  document.getElementById(parentNodeId + "Txt").setAttribute("value",nodeName);
  
  //如果被选择的是一级菜单，更新二、三级菜单
  if(parentNodeId == "mainClass") {
   //缓存一级菜单选择
   document.getElementById(parentNodeId + "Txt").setAttribute("tempId",nodeId);
   //清空二级菜单列表
   document.getElementById("subClassTxt").setAttribute("value","请选择");
   //清空三级菜单列表
   document.getElementById("itemClassTxt").setAttribute("value","请选择");
   //移除二级节点
   removeChildNodes("subClass");
   //移除三级节点
   removeChildNodes("itemClass");
   //查找二级节点
   var resultSubNodes = findXmlnodes("//mainClass[@id=" + nodeId + "]/subClass",resultSubNodes);
   //alert(resultSubNodes.length);
   var subNode = document.getElementById("subClass");
   //给二级节点添加子子节点
    addChildrenNodes(subNode,resultSubNodes);
   
   
  }
  
  //如果更新的是二级菜单，更新三级菜单
  if(parentNodeId == "subClass") {
   //获得一级菜单缓存值
   var mainClassId = document.getElementById("mainClassTxt").getAttribute("tempId");
   //清空三级菜单列表
   document.getElementById("itemClassTxt").setAttribute("value","请选择");
   removeChildNodes("itemClass");
   //移除三级节点
   removeChildNodes("itemClass");
   //查找三级节点
   var resultItemNodes = findXmlnodes("//mainClass[@id=" + mainClassId + "]/subClass[@id=" + nodeId + "]/item",resultItemNodes);
   //alert(resultItemNodes.length);
   var itemNode = document.getElementById("itemClass");
   //给三级节点添加子子节点
    addChildrenNodes(itemNode,resultItemNodes);
  }
  
 }
 
 

 //—————添加子节点列表 parentNode： 父节点, childrenNodes: 子节点列表—————
 function addChildrenNodes(parentNode,childrenNodes) {
  for(i = 0; i <　childrenNodes.length; i++) {
   //var tempNode = childrenNodes.item(i);
   //prompt("tempNode",tempNode.xml);
   createNode("div",childrenNodes.item(i).getAttribute("id"),childrenNodes.item(i).getAttribute("name"),parentNode);
   //alert(childrenNodes.item(i).getAttribute("name") + "  " + childrenNodes.item(i).getAttribute("id"));
  }
 }
 
 
 //—————创建子节点，并添加到父节点 type: 节点类型, id：节点Id, txt:文本节点文本值，parentNode： 父节点 —————
 function createNode(type,id,txt,parentNode) {
  //文本节点
  var txtNode = null;
  //需创建的子节点
  var subNode = null;
  
  //判断节点类型是否为空，为空直接返回
  if(type == null) {
   return;
  }
  //创建节点
     subNode = document.createElement(type);
  
  //判断是否包含文本是否为空，不为空则创建并添加文本子节点
  if(txt != null) {
   
   //设置文本节点弹出文字
   if(checkSelectMenuItemLength(txt)){
    subNode.title = txt;
    var txtTemp = txt.substring(0, 5) + "..." ;  
    //创建文本节点
    txtNode = document.createTextNode(txtTemp);
   }else {
    txtNode = document.createTextNode(txt);
   }
   
   //添加文本节点
   subNode.appendChild(txtNode);
  }
  
  //判断id是否为空，不为空则添加id属性
  if(id != null) {
   subNode.setAttribute('id',id);
  }
  subNode.attachEvent("onclick",hideMenuItemEvent);
  subNode.attachEvent("onclick",updateSelectMenu);
  subNode.attachEvent("onmouseover",romanceItem);
  subNode.attachEvent("onmouseout",unRomanceItem);
  
  //添加新建子节点到父节点
  parentNode.appendChild(subNode);
  
 }
 
 //—————查找数据节点 condition: XPath查询条件, resultNodes:返回节点集合—————
 function findXmlnodes(condition,resultNodes) {
  //判断查询条件是否为空
  if(condition == null) {
   return;
  }
  // 初始化ActiveXObject DOMDocment对象
  var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
  // 设置异步方式
  xmlDoc.async=false;
  //　加载xml
  xmlDoc.load(document.getElementById("mainClassTxt").getAttribute("xmlSrc"));
  //  指定查询语言
  xmlDoc.setProperty("SelectionLanguage","XPath");
  //  查询并获得节点
  resultNodes = xmlDoc.documentElement.selectNodes(condition);
  //alert(resultNodes.length); 
  return resultNodes;
 }
 
 
 //—————移除所有子节点 pareantNodeName： 父节点名—————
 function removeChildNodes(pareantNodeName) {
  var subNodes = document.getElementById(pareantNodeName).childNodes;
  var subNodeslength = subNodes.length;
  
  for (i = 0; i < subNodeslength; i++) {
    subNodes.item(0).removeNode(true);
   }
 }
 

 //—————渲染条目背景色—————
 function romanceItem() {
  event.srcElement.style.backgroundColor="cornflowerblue";
 }

 //—————反渲染条目背景色—————
 function unRomanceItem() {
  event.srcElement.style.backgroundColor="#ffffff";
 }

 //—————检测条目长度—————
 function checkSelectMenuItemLength(txt) {
  if(txt.length > 5)
   return true;
  else
   return false;
 }
 
 //—————设置层的绝对坐标 setNode：须设置坐标的节点 consultNode：参照节点 —————
 function setDivAbsulotePosition(setNode,consultNode) {
  setNode.style.top = getPosition(consultNode).y +　consultNode.offsetHeight;
  setNode.style.left = getPosition(consultNode).x;
  setNode.style.width = consultNode.offsetWidth;
 }
 
 function setBtnAbsulotePosition(setNode,consultNode) {
  setNode.style.top = getPosition(consultNode).y;
  setNode.style.left = getPosition(consultNode).x + consultNode.offsetWidth;
 
 }
 
 //—————获取参照节点的绝对位置 node： 参照节点—————
 function getPosition(node){ 
  var left = 0; 
  var top  = 0; 
  while (node.offsetParent){ 
   left += node.offsetLeft; 
   top += node.offsetTop; 
  node = node.offsetParent; 
  } 
  left += node.offsetLeft; 
  top += node.offsetTop;
 return {x:left, y:top}; 
} 
 
</script>

<html>
 <body onload="inintSelectMenu();">
  <form>
   <br><br><br><br><br><br><br><br><br><br><br><br>
   <center>
   <table>
    <tr>
    <td>
    &nbsp;&nbsp;
    主分类
    <input type='text' id='mainClassTxt' readonly='true' value="请选择" xmlSrc="selectMenuData.xml">
     <input id='mainClassBtn' type='button' value='>>'  onclick="showMenuItem('mainClass');hideMenuItem('itemClass');hideMenuItem('subClass');" />
    </input>
     <div id='mainClass' class="close" >
     </div>
    </td>
       <td>
       &nbsp;&nbsp;
    子分类
    <input  type='text' id='subClassTxt' readonly='true' value="请选择" >
     <input id='subClassBtn' type='button' value='>>' onclick="showMenuItem('subClass');hideMenuItem('mainClass');hideMenuItem('itemClass');"/>
    </input>
     <div id='subClass' class="close" >
     </div>
    </td>
       <td>
       &nbsp;&nbsp;
    条  目
    <input type='text' id='itemClassTxt' readonly='true' value="请选择"  >
     <input id='itemClassBtn' type='button' value='>>' onclick="showMenuItem('itemClass');hideMenuItem('mainClass');hideMenuItem('subClass');" />
    </input>
     <div id='itemClass' class="close" >
     </div>
    </td>
    </tr>
    </table>
   </center>
  </form>
 </body>
</html>
<----------------HTML部分--------------------->



<----------------XML部分--------------------->
<classes>
 <mainClass id='1' name='book'>
  <subClass id='1' name='computer'>
   <item id='1' name='think in java'></item>
   <item id='2' name='C#'></item>
   <item id='3' name='javascript'></item>
  </subClass>
  <subClass id='2' name='literature'>
   <item id='1' name='literaturea'></item>
   <item id='2' name='literatureb'></item>
   <item id='3' name='literaturec'></item>
  </subClass>
  <subClass id='3' name='test'>
   <item id='1' name='testaaaa'></item>
   <item id='2' name='testbbbb'></item>
   <item id='3' name='testcccc'></item>
  </subClass>
  <subClass id='4' name='ssssss'>
   <item id='1' name='sssssssaaa'></item>
   <item id='2' name='sssssssbbb'></item>
   <item id='3' name='sssssssccc'></item>
  </subClass>
 </mainClass>
 <mainClass id='2' name='book2'>
  <subClass id='1' name='computer2'>
   <item id='1' name='think in java2'></item>
   <item id='2' name='C#2'></item>
   <item id='3' name='javascript2'></item>
  </subClass>
  <subClass id='2' name='literature2'>
   <item id='1' name='literaturea21'></item>
   <item id='2' name='literatureb22'></item>
   <item id='3' name='literaturec23'></item>
  </subClass>
  <subClass id='3' name='test2'>
   <item id='1' name='testaaaa21'></item>
   <item id='2' name='testbbbb22'></item>
   <item id='3' name='testcccc23'></item>
  </subClass>
  <subClass id='4' name='ssssss2'>
   <item id='1' name='sssssssaaa21'></item>
   <item id='2' name='sssssssbbb22'></item>
   <item id='3' name='sssssssccc23'></item>
  </subClass>
 </mainClass>
 <mainClass id='3' name='book3'>
  <subClass id='1' name='computer3'>
   <item id='1' name='think in java3'></item>
   <item id='2' name='C#3'></item>
   <item id='3' name='javascript3'></item>
  </subClass>
  <subClass id='2' name='literature3'>
   <item id='1' name='literaturea31'></item>
   <item id='2' name='literatureb32'></item>
   <item id='3' name='literaturec33'></item>
  </subClass>
  <subClass id='3' name='test3'>
   <item id='1' name='testaaaa31'></item>
   <item id='2' name='testbbbb32'></item>
   <item id='3' name='testcccc33'></item>
  </subClass>
  <subClass id='4' name='ssssss3'>
   <item id='1' name='sssssssaaa31'></item>
   <item id='2' name='sssssssbbb32'></item>
   <item id='3' name='sssssssccc33'></item>
  </subClass>
 </mainClass>
 <mainClass id='4' name='book4'>
  <subClass id='1' name='computer4'>
   <item id='1' name='think in java4'></item>
   <item id='2' name='C#4'></item>
   <item id='3' name='javascript4'></item>
  </subClass>
  <subClass id='2' name='literature4'>
   <item id='1' name='literaturea41'></item>
   <item id='2' name='literatureb42'></item>
   <item id='3' name='literaturec43'></item>
  </subClass>
  <subClass id='3' name='test4'>
   <item id='1' name='testaaaa41'></item>
   <item id='2' name='testbbbb42'></item>
   <item id='3' name='testcccc43'></item>
  </subClass>
  <subClass id='4' name='ssssss4'>
   <item id='1' name='sssssssaaa41'></item>
   <item id='2' name='sssssssbbb42'></item>
   <item id='3' name='sssssssccc43'></item>
  </subClass>
 </mainClass>
</classes>
<----------------XML部分--------------------->