六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 121|回复: 0

js操作table(创建并设置样式)与图片控制

[复制链接]

升级  11%

65

主题

65

主题

65

主题

举人

Rank: 3Rank: 3

积分
233
 楼主| 发表于 2013-2-7 20:34:54 | 显示全部楼层 |阅读模式
一、操作table
.TableLine{border-collapse:collapse;border:1px solid #9BC2E0;}.TableLine td{border:1px solid #9BC2E0;}tr.over td {background:#bcd4ec; /*这个将是鼠标所在高亮行的背景色*/}/********长文本,不换行*************/.longTxt{overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;white-space:nowrap;text-align:left;padding-left: 2px;}
/** * 创建表格 * id  为表格id * arr 为表格表头 */function createTable(id,arr){var table = document.createElement('table');table.setAttribute("id",id);table.setAttribute("className","TableLine");//设定样式table.setAttribute("width",'98%');table.setAttribute("cellpadding",'3');table.setAttribute("cellspacing",'0');var row = table.insertRow();row.style.setAttribute("backgroundColor","#e0e0e0");for (var i = 0; i < arr.length; i++) {         var col = row.insertCell();         if(i==0){         col.setAttribute("width",'3%');         } col.setAttribute("className","border:1px solid #9BC2E0;"); col.setAttribute("align","center"); col.style.fontSize="13px"; col.style.fontWeight="Bold";;         //var style  = document.createAttribute("styles");         //style.nodeValue = "font-size:large";         //col.setAttributeNode(style);         col.innerHTML = arr;    }    //alert(table.outerHTML);    return table;}

/** * 向表格插入一行 */function addRow(table,id,arr){  var row =table.insertRow();  row.setAttribute("id",id);  row.onclick=function (){};  for(var i=0;i<arr.length;i++){var col = row.insertCell();col.innerHTML = arr;        //col.innerText = arr;col.setAttribute("title",arr);  }}

复选(以name)分组的全选与取消全选
function checkAll(name) {       var el = document.getElementsByTagName('input');       var len = el.length;     for(var i=0; i<len; i++) {            if((el.type=="checkbox") && (el.name==name)) {                 el.checked = true;            }       } }  function clearAll(name) {       var el = document.getElementsByTagName('input');       var len = el.length;       for(var i=0; i<len; i++) {            if((el.type=="checkbox") && (el.name==name)) {                 el.checked = false;            }       } }

引入多个js文件:
function _IncludeJS(inc) {     var script='<'+'script type="text/javascript" src="'+inc+'"'+'> <'+'/script>';     document.writeln(script); } _IncludeJS('ajaxServer.js');

/** * 验证日期 */function checkDateTimeStr(str){var reg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2})$/; var r = str.match(reg); if(r==null)return false; var d=new Date(r[1], r[3]-1,r[4],r[5],r[6]); return (d.getFullYear()==r[1] && (d.getMonth()+1)==r[3] && d.getDate()==r[4] && d.getHours()==r[5] && d.getMinutes()==r[6]);}
二、图片控制
(1)css控制
img {    max-width:500px;   width:600px;    width:expression(width>500?"500px":width+"px");   overflow:hidden;}
(2)js控制
/*********dynamic load image****************/function createImg(imgSrc){var objDiv = document.createElement("DIV");objDiv.id = "imgDiv";objDiv.innerHTML = '<img src="' + imgSrc + '"   border="0"/>';document.body.appendChild(objDiv);}/********same scale resize image************/function resizeImage(imgObj, maxWidth, maxHeight){var image=new Image();image.src=imgObj.src;if(image.width > maxWidth || image.height > maxHeight){   w=image.width/maxWidth;h=image.height/maxHeight;       if(w > h){ imgObj.width=maxWidth;   imgObj.height=image.maxHeight/w;       }else{  imgObj.height=maxHeight;   imgObj.width=image.width/h;       }} }createImg('Sunset.jpg');
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表