window.js 主要包含了页面的一些操作


Posted in Javascript onDecember 23, 2009
//处理页面异常 
function Exception() { 
} //页面元素共同接口 
function View() { 
//页面元素 
this.element = null; 
//文字颜色 
this.color = null; 
//设置样式 
this.setStyle = function(name, value) { 
eval("this.element.style." + name + " = '" + value + "'"); 
} 
//获取样式 
this.getStyle = function(name) { 
return eval("this.element.style." + name); 
} 
//设置浮动样式 
this.setFloat = function(styleFloat) { 
this.setStyle("styleFloat", styleFloat); 
} 
//设置背景色 
this.setBackgroundColor = function(backgroundColor) { 
this.setStyle("backgroundColor", backgroundColor); 
} 
//获取背景色 
this.getBackgroundColor = function() { 
return this.getStyle("backgroundColor"); 
} 
//设置对象宽度 
this.setWidth = function(width) { 
//alert(width); 
this.setStyle("width", width); 
} 
//设置对象宽度 
this.setHeight = function(height) { 
this.setStyle("height", height); 
} 
//设置页面定位 
this.setPosition = function(position) { 
this.setStyle("position", position); 
} 
//设置层 
this.setZIndex = function(zIndex) { 
this.setStyle("zIndex", zIndex); 
} 
//左边距离 
this.setLeft = function(left) { 
this.setStyle("left", left); 
} 
//上边距离 
this.setTop = function(top) { 
this.setStyle("top", top); 
} 
//是否换行 
this.setWhiteSpace = function(whiteSpace) { 
this.setStyle("whiteSpace", whiteSpace); 
} 
this.setMargin = function(margin) { 
this.setStyle("margin", margin); 
} 
this.setPadding = function(padding) { 
this.setStyle("padding", padding); 
} 
//设置属性 
this.setAttributeIsHave = function(attrName, value) { 
eval("this.element.setAttribute('" + attrName + "', '" + value + "')"); 
} 
this.setId = function(id) { 
this.setAttributeIsHave("id", id); 
} 
this.setInnerText = function(innertext) { 
this.setAttributeIsHave("innerText", innertext); 
} 
//加入自定义属性 
this.setAttributeIsNot = function(attrName, value) { 
var attr = document.createAttribute(attrName); 
attr.value = value; 
this.element.setAttributeNode(attr); 
} 
//事件监听 
this.eventListener = function(eventName, exec) { 
this.element.attachEvent(eventName, exec); 
} 
//鼠标移入对象事件 
this.onmouseenterListener = function(exec) { 
this.eventListener("onmouseenter", exec); 
} 
//鼠标移出对象事件 
this.onmouseleaveListener = function(exec) { 
this.eventListener("onmouseleave", exec); 
} 
//鼠标单击对象事件 
this.onclickListener = function(exec) { 
this.eventListener("onclick", exec); 
} 
} 
//单一元素 
function Single() { 
View.call(this); 
} 
//可以有子元素 
function Multi() { 
View.call(this); 
//子元素集合 
this.childElementList = new Array(); 
//加入子元素 
this.addView = function(childElement) { 
if(this.element == null) { 
//待加入异常信息 
return; 
} 
this.childElementList[this.childElementList.length] = childElement; 
} 
//关联子元素 
this.appendChildElement = function(childElement) { 
this.element.appendChild(childElement.element); 
} 
//显示元素 
this.show = function() { 
for(var i = 0; i < this.childElementList.length; i++) { 
var childElement = this.childElementList[i]; 
this.appendChildElement(childElement); 
childElement.show(); 
} 
} 
} 
//面板 
function Panel() { 
Multi.call(this); 
//创建页面元素 
this.element = document.body; 
} 
//行布局 
function LineLayout() { 
Multi.call(this); 
this.element = document.createElement("div"); 
} 
//左布局 
function LeftLayout() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setFloat("left"); 
} 
//右布局 
function RightLayout() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setFloat("right"); 
} 
function Menu() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setWidth("100%"); 
var clickListener = function() { 
return; 
}; 
var moveInBackgroundColor = "red"; 
var moveOutBackgroundColor = this.getBackgroundColor(); 
this.show = function() { 
var menuItem = null; 
var menuEntiy = null; 
for(var i = 0; i < this.childElementList.length; i++) { 
menuItem = new MenuItem(); 
menuEntiy = this.childElementList[i]; 
menuItem.addMenuEntity(menuEntiy); 
menuItem.onmouseenterListener(moveInMenuItem); 
menuItem.onmouseleaveListener(moveOutMenuItem); 
menuItem.onclickListener(this.clickMenuItem ); 
menuItem.setPadding("0 5px 0 5px"); 
this.appendChildElement(menuItem); 
} 
} 
this.setClickListener = function(exec) { 
clickListener = exec; 
} 
function moveInMenuItem() { 
event.srcElement.style.backgroundColor = moveInBackgroundColor; 
} 
function moveOutMenuItem() { 
event.srcElement.style.backgroundColor = moveOutBackgroundColor; 
} 
this.clickMenuItem = function() { 
var child = clickListener(); 
document.body.appendChild(child.element); 
child.setLeft(event.srcElement.offsetLeft); 
child.setTop(event.srcElement.offsetParent.offsetTop + event.srcElement.clientHeight); 
child.show(); 
} 
} 
function ChildMenu() { 
Multi.call(this); 
this.element = document.createElement("div"); 
this.setPosition("absolute"); 
this.setZIndex(100); 
this.setBackgroundColor("#ccffcc"); 
var moveInBackgroundColor = "red"; 
var moveOutBackgroundColor = this.getBackgroundColor(); 
this.show = function() { 
var menuItem = null; 
var menuEntiy = null; 
for(var i = 0; i < this.childElementList.length; i++) { 
menuItem = new MenuItem(); 
menuItem.setFloat("none"); 
menuEntiy = this.childElementList[i]; 
menuItem.addMenuEntity(menuEntiy); 
menuItem.onmouseenterListener(moveInMenuItem); 
menuItem.onmouseleaveListener(moveOutMenuItem); 
//menuItem.onclickListener(clickMenuItem); 
menuItem.setPadding("0 5px 0 15px"); 
this.appendChildElement(menuItem); 
} 
} 
function moveInMenuItem() { 
event.srcElement.style.backgroundColor = moveInBackgroundColor; 
} 
function moveOutMenuItem() { 
event.srcElement.style.backgroundColor = moveOutBackgroundColor; 
} 
} 
function MenuEntiy(id, name, action) { 
this.id = id; 
this.name = name ; 
this.action = action; 
} 
function MenuItem() { 
Single.call(this); 
this.element = document.createElement("div"); 
this.setFloat("left"); 
this.setWhiteSpace("nowrap"); 
this.addMenuEntity = function(menuEntity) { 
this.setId(menuEntity.id); 
this.setInnerText(menuEntity.name); 
this.setAttributeIsNot("action", menuEntity.action); 
} 
}
Javascript 相关文章推荐
javascript 操作文件 实现方法小结
Jul 02 Javascript
jquery pagination插件实现无刷新分页代码
Oct 13 Javascript
jQuery timers计时器简单应用说明
Oct 28 Javascript
点击页面其它地方隐藏该div的两种思路
Nov 18 Javascript
Lua表达式和控制结构学习笔记
Dec 15 Javascript
详解JavaScript中的客户端消息框架设计原理
Jun 24 Javascript
Jquery ajax请求导出Excel表格的实现代码
Jun 08 Javascript
Javascript iframe交互并兼容各种浏览器的解决方法
Jul 12 Javascript
AngularJS 指令的交互详解及实例代码
Sep 14 Javascript
AngularJS Controller作用域
Jan 09 Javascript
node-sass安装失败的原因与解决方法
Sep 04 Javascript
vue实现倒计时获取验证码效果
Apr 17 Javascript
js 效率组装字符串 StringBuffer
Dec 23 #Javascript
jquery 表单取值常用代码
Dec 22 #Javascript
JavaScript是否可实现多线程  深入理解JavaScript定时机制
Dec 22 #Javascript
JavaScript 图片预览效果 推荐
Dec 22 #Javascript
javascript 年月日联动实现核心代码
Dec 21 #Javascript
Javascript和Ajax中文乱码吐血版解决方案
Dec 21 #Javascript
利用jQuery的$.event.fix函数统一浏览器event事件处理
Dec 21 #Javascript
You might like
锁定年轻人的双倍活力 星巴克推出星倍醇即饮浓咖啡
2021/03/03 咖啡文化
PHP图片库imagemagick安装方法
2014/09/23 PHP
Yii入门教程之Yii安装及hello world
2014/11/25 PHP
phpStudy 2016 使用教程详解(支持PHP7)
2017/10/18 PHP
php7连接MySQL实现简易查询程序的方法
2020/10/13 PHP
html下载本地
2006/06/19 Javascript
javascript 特性检测并非浏览器检测
2010/01/15 Javascript
Javascript 倒计时源代码.(时.分.秒) 详细注释版
2011/05/09 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
2012/12/25 Javascript
JS获取select的value和text值的简单实例
2014/02/26 Javascript
JS实现响应鼠标点击动画渐变弹出层效果代码
2016/03/25 Javascript
深入理解Angular中的依赖注入
2017/06/26 Javascript
简单快速的实现js计算器功能
2017/08/17 Javascript
Vue如何从1.0迁移到2.0
2017/10/19 Javascript
Vue全家桶实践项目总结(推荐)
2017/11/04 Javascript
Vue.js实现图片的随意拖动方法
2018/03/08 Javascript
vue基于mint-ui实现城市选择三级联动
2020/06/30 Javascript
JavaScript实现简单音乐播放器
2020/04/17 Javascript
JavaScript Array对象基本方法详解
2019/09/03 Javascript
Bootstrap实现前端登录页面带验证码功能完整示例
2020/03/26 Javascript
原生js实现的观察者和订阅者模式简单示例
2020/04/18 Javascript
JavaScript鼠标悬停事件用法解析
2020/05/15 Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
2020/09/08 Javascript
Python 利用pydub库操作音频文件的方法
2019/01/09 Python
快速解释如何使用pandas的inplace参数的使用
2020/07/23 Python
CSS3实现银灰色动画效果的导航菜单代码
2015/09/01 HTML / CSS
澳大利亚现代波西米亚风格女装网站:Bohemian Traders
2018/04/16 全球购物
Expedia法国:全球最大在线旅游公司
2018/09/30 全球购物
Python如何定义一个函数
2015/09/01 面试题
幼儿如何来做好自我评价
2013/11/05 职场文书
大学生暑期实践感言
2014/02/26 职场文书
2014年路政工作总结
2014/12/10 职场文书
2014年后勤工作总结范文
2014/12/16 职场文书
【DOTA2】半决赛强强对话~ PSG LGD vs EHOME - DPC 2022 CN REGIONAL FINALS WINTER
2022/04/02 DOTA
Flutter集成高德地图并添加自定义Maker的实践
2022/04/07 Java/Android
Python使用openpyxl模块处理Excel文件
2022/06/05 Python