利用js实现表格的显示隐藏

table<script type="text/javascript">
function show(obj){
var tbobj=document.getElementById(obj);
tbobj.style.display="";
}
function hide(obj){
var tbobj=document.getElementById(obj);
tbobj.style.display="none";
}
</script>  

注:隐藏/显示,用于直接控制显示其中一个或几个,隐藏其中几个

<script language=javascript type="text/javascript">
<!--//
function   change(obj)  
  {  
  if(document.getElementById(obj).style.display=='none')  
  {
    document.getElementById(obj).style.display='';}  
    else
    {
        document.getElementById(obj).style.display='none';}
      }
//-->
</script>

注:自动判断其显示或隐藏,若显示则隐藏,隐藏则显示!

<table id=a><tr><td>show/hide</td></tr></table>

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript:定义行为和动作 (基于对象和事件驱动的客户端脚本语言;也是一种广泛应用于客户端Web开发的脚本语言) 基于对象:网页中的一切元素都是假象!不需要new,即可直接使用 事件驱动:JavaScript的执行都是由事件引发 解释执行:先读到的先执行,后读到的会替代先读的 可以使用任何文本编辑工具编写 JavaScript 代码,然后由浏览器解释执行。 JavaScript常用于实现如下功能: |--控制文档的外观和内容; |--对浏览器的控制; |--与 HTML 表单的交互; |--与用户的交互; |--执行计算等。 1.单击事件:定义在按钮的开始标签中 语法:onclick="js语句" 弹出警告:alert(‘字符串’) 强调:1.js区分大小写 2.字符串单双引号不区分 [removed]标签:页面中专门集中编写JavaScript的区域 js的方法定义:function方法名([参数列表]){ 方法体 [return 返回值] } 注意:js中的方法可以直接写在代码中,不需要“类”包裹 使用方法:方法名()-->方法调用-->立即执行 2.js文件:网页外专门保存js脚本的文件--推荐 强调:HTML、CSS、JS都要使用UTF-8编码保存(window系统) 使用js文件引入网页:[removed][removed] 强调:一旦定义src属性则其中的代码失效 解释执行:语句也可以直接写在js文件中,边解释边执行 3.***调试*** |--①.只有在执行时,才会报错 |--②.错误信息,浏览器页面看不到--没效果 | 解决:控制台--(工具-->JavaScript控制台或F12) | 包含错误信息;指向错误位置的超链接 |--③.打桩:在指定变量位置输出变量或对象的内容 console.log(内容);-->出现在控制台-->日志 4.变量:js中的变量不需要提前指定类型,由赋值时动态决定 所有的变量都用var声明 5.数据类型: |--String(字符串类型) |--Number(数字类型) |--Boolean(布尔类型)0、-0、null、""、false/undefined或NaN,则该对象设置为false。其余都可以当true 6.数据类型的隐式转换: |--数字 + 字符串:数字转换为字符串 |--数字 + 布尔值:true转换为1,false转换为0 |--字符串 + 布尔值:布尔值转换为字符串true或false |--布尔值 + 布尔值:布尔值转换为数值1或0 7.数据类型转换函数 :(方法前不需要对象调用的:全局函数) |--toString():转换成字符串。所有数据类型均可转换为 string 类型; |--parseInt():强制转换成整数。如果不能转换,则返回 NaN(not a number); |--parseFloat():强制转换成浮点数。如果不能转换,则返回 NaN(Not a Number) |--typeof():查询数值当前类型。 |--isNaN():判断是否为数字。返回 true:不是数字/false:是数字 | |--isNan(""):对空字符串不验证,直接返回false | |--如果输入的是字符串类型的数字,返回false--不能判断数据类型,只判断内容 | |--如果输入的是boolean,返回false。因为boolean可以和number类型直接做计算 | |--和任何数字计算都得NaN;和任何数字作比较都得false |--注:[removed]();节点输出,即在当前位置输出括号里的内容 *凡是从页面上进入js的都是字符串类型 8.查找元素:抓住根节点,就等于抓住整棵树 网页的根节点:document对象 要找元素,必须利用document对象(当前网页文件) 精确查找某个ID的元素:document.getElementById(id名); 9.null和undefined: |--null:一个特殊的值,表示“无值”--空对象。数据类型为Object |--undefined:表示声明了变量但从未赋值或者对象属性不存在 10.双等号(==)和全等号(===): |--“==”为确定两个运算数是否相等,“==”运算符会进行类型转换。转换后运算数相等就返回true,否则返回false |--“===”不执行类型转换,即,只有在无需类型转换运算数就相等的情况下,才返回true,否则返回false |--附:if(null)、if(defined)、if(NaN)都相当于if(false) -----猜数字游戏----- 失去焦点时,判断猜对猜错 获得焦点:onfocus 失去焦点:onblur 当事件就发生在获得内容的当前元素上: this直接获得当前内容对象。可以代替当前对象完成一切操作,拥有当前对象的所有属性 前端优化:js中最好用三目运算代替if else 11.String: |--查找:x.indexOf(‘关键字’[,开始位置下标]) | 每次只查找第一次出现的位置 |--替换:x.replace(‘关键字’[,‘替换内容’])--不会修改原x字符串 | 每次只替换第一次找到的 |--查找和替换所有:while循环 | |--String 对象的常用方法有: |--x.toLowerCase()、x.toUpperCase():大小写转换方法; |--x.charAt(index):返回指定位置的字符; |--x.charCodeAt(index):返回指定位置字符的Unicode编码; |--x.indexOf(findstr,index)、x.lastIndexOf(findstr,index): 获取指定字符; |--x.substring(start, end): 获取子字符串; |--x.replace(findstr,tostr):替换子字符串; |--x.split(bystr): 拆分子字符串。 |--String与正则表达式 |--str.match(regExp);--查找str中匹配正则表达式的关键字 | 返回:如果没找到,返回null。若找到,返回1个数组,数组的每个元素是每个找到的匹配关键 | |--str.replace(regExp,"替换值")--替换str中所有匹配的关键字 | 强调:replace方法不改变元字符串,只能返回新字符串。必须用变量接收新字符串 | |--js中正则表达式语法:/正则表达式/[属性后缀]--其中属性后缀,g:全局匹配 i:忽略大小写(仅英文有效) 如果不适用模式匹配方式,将执行原文匹配 结果:如果正则表达式写错,也将执行原文匹配 12.Array笔试题:js中数组声明方式: A new Array(7) B new Array(7,‘a’,true) C [7,'a',true]--js中所有[]都表示数组 D []--实例化一个空数组对象 实例化空数组:var arr=[]; 特点:元素个数不限定,元素类型不限制 13.Array 对象的常用方法: |--1.join()方法--用于把数组中的所有元素放入一个字符串   | eparato表示要使用的分隔符。如果省略该参数,则使用逗号作为分隔符 |--2.toString()方法--可把数组转换为字符串,并返回结果 |--3.concat()方法--用于连接两个或多个数组,该方法不会改变现有的数组 |--4.slice()方法--截取元素。根据给定的范围可从已有的数组中返回选定的元素 14.Functionjs中一切都是对象,连方法都是1个对象!! 笔试题:js中方法定义集中方式: A:function compare(a,b){return a-b;}---*可以任意地方声明方法* B:var compare=function(a,b){return a-b;} ---| --其实方法名也是方法对象的变量名;等号右边其实就是1个匿名方法对象 |--*必须在传递之前声明方法对象* C:var compare=new Function('a','b','return a-b') ---| --其实js底层就是new Function;构造函数中的参数都是字符串 结论:所有的方法都是function类型的。 15.JavaScript中的所有事物都是对象,分为三类: |--简单对象:String、Number、Boolean |--组合对象:Array、Math、Date |--复杂对象:Function、Regex、Object等 16.Array排序: |--升序:function compare(a,b){return a-b;} |--降序:function compare(a,b){return b-a;} 比较器用法:arr.sort(比较器方法名); 遍历:for(var i=0;i<arr.length;i++)--等同Java Array倒转:arr.reverse();用于颠倒数组中元素的顺序 17.Array元素操作: |--arr.push(x);向数组增加1个新元素x(位于数组最后位置) |--arr.splice(开始位置,删除几个[,x1,x2,x3...]) |--arr.indexOf(x) 返回x在数组中的下标---经常用于判断元素是否存在。如返回-1,x则不在数组中 18.Number对象: |--x.toFixed(num):可把Number四舍五入为指定小数位数(num:0-20)的数字 |--x.toString():用于把一个 Number 对象转换为一个字符串,并返回结果 19.正则表达式对象:(专门用于查找和验证) reg.test(‘要验证的完整字符串’)匹配返回true,否则返回false 强调:如果正则表达式使用了^和$,必须完整匹配才行。反之则部分匹配 20.Date对象:(计算方法:先get,再计算,最后set回去) |--1.每个分量上都有一对get/set方法 |--2.命名:get|set年月日,单数;get|set时分秒,复数(s) |--3.除了日期从1开始到31结束外,其余都从0开始到-1结束 |--Date对象的常用方法 |--1.获取日期数据 getDate()、getDay()、getFullYear()等 |--2.修改日期数据 setDate()、setDay()、setFullYear()等 |--3.获取日期格式的字符串 toString()、toLocaleTimeString()、toLocaleDateString()等 21.argument参数:所有方法都隐藏的一个数组对象 作用:不设置任何的形参的情况下,自动接收所有传入参数 arguments.length:获得参数个数 arguments[i]:获得每个参数--都要判断和类型转换 22.全局函数:不用任何对象点(.)就可以调用--可用于所有的 JavaScript 对象 常用的全局函数有:parseInt/parseFloat、isNaN、eval、decodeURI/encodeURI等。 encodeURI和decodeURI: |--encodeURI:可把字符串作为 URI 进行编码 |--decodeURI:decodeURI()函数可对encodeURI()函数编码过的 URI 进行解码 eval() 函数可计算某个字符串,并执行其中的的JavaScript代码 23.BOM:操作浏览器窗口的对象模型。 --即浏览器对象模型 ,用来访问和操纵浏览器窗口,使 JavaScript 有能力与浏览器“对话” DOM:操作网页中元素对象的对象模型--即文档对象模型,用来操作文档 window对象的常用属性: |--document:窗口中显示的 HTML 文档对象 |--history:本次浏览过窗口的历史记录 | --前进:history.go(1);后退:history.go(-1);刷新:history.go(0); |--location:窗口文件地址对象(地址栏) |--event:事件对象 |--screen:屏幕对象 |--name:窗口名称 |--opener:打开当前窗口的 window 对象 |--navigator:有关浏览器的信息 |--cookieEnable:判断当前浏览器是否启用cookie |--userAgent:获得浏览器的名称和版本号 window 对象的常用方法有: |--alert();--警告框--只能点确认 |--confirm();确认框--可以选择确认或取消 |--prompt();对话框--用于显示可提示用户进行输入 |--window.open('url'[,'name']):打开1个选项卡 |--window.close():关闭当前选项卡 24.定时器:凡是网页中自动动态的效果都是用计时器实现的 |--周期性定时器:每隔一个时间段自动执行一次,循环执行 | |--setInterval() 启动-->用于启动一个周期性定时器 | 语法:timer=setInterval(方法名,间隔毫秒数) |--clearInterval() 停止-->用于停止一个周期性定时器 语法:timer=clearInterval(timer) |--1次性定时器:先等待一段时间,再自动执行一次,自动结束 |--setTimeout() 启动-->用于启动一个一次性定时器 |--clearTimeout() 停止-->用于停止一个一次性定时器 附: |--表单控件,读写内容:.value |--普通html元素,要想读写开始标签和结束标签之间的内容:[removed] 计时器:1.做什么事:方法; 2.一个变量:存计时器的线程号 3.何时启动计时器:事件 25.document:1.代表当前网页文档; 2.所有网页元素的根元素; 3.查找和操作元素,都要依靠document; 节点:nodeName--标签名或属性名 DOM操作样式:对象.className属性 等效于<标签class=""> DOM树:当前节点向上:txtObj[removed]() 向下:txtObj.getElementByTagName() 26.表单中查找控件对象:document.getElementsByName('name属性') DOM增加新节点:两种方法 创建新节点:document.creatElement('标签名') --此时新元素对象仅在内存中游离,页面看不见! 添加新节点:找到父元素! |--appendChild() 方法只能将新节点作为某节点的最后一个子节点 | --此时新元素追加到了父元素的末尾 |--parentNode.insertBefore()(新元素对象,A)--其中A为新元素要插入位置的后一位元素 DOM删除元素:node.removeChild(childNode)--node为父节点,childNode为要删除的节点 27.HTML DOM Select和Option对象: select对象:代表HTML表单中的一个下拉列表,每个<select> 标签即表示一个 Select 对象 |--属性: |--options:返回包含<select>元素中所有<option>的一个数组,每个元素对应一个<option>标签,索引从0开始 |--selectedIndex:设置或返回下拉列表中被选选项的索引号 |--size:设置或返回下拉列表中一次显示显示的选项数 |--方法: |--add(option):用于向<select>添加一个<option>元素。 |--remove(index):从下拉列表删除选项 Select对象有事件onChange当改变选择时调用的事件句柄。Select对象的onChange属性引用了一个事件句柄函数。当用户选 中一个选项,或者取消了对一个选项的选定时,就会调用该句柄。这个事件不会指定新的选项是什么,必须通过Select对象的 selectedIndex属性,或者各个Option对象的selected属性来确定这一点。 option对象:代表HTML表单中下拉列表中的一个选项,每个<option>标签表示一个Option对象 |--创建:var o = new Option(text,value); |--属性: |--index:返回下拉列表中选项的索引位置 |--text:设置或返回选项的文本值; |--value:设置或返回选项的值; |--selected:设置或返回选项的 selected 属性的值,该属性设置选项的当前状态,如果为 true,则该选项被选中 28.table对象: rows数组:表中所有行对象 方法:var row=table.iusertRow(i);--返回刚添加的新行 table.deleteRow(i); --i:行的下标。如果i取-1,即在表格末尾追加一行 tableRow对象: cells数组:当前行中所有单元格的对象 方法:var 刚添加的新单元格=tr.iusertCell(i); tr.deleteCell(i); tableCell对象:取单元格内容--td[removed] 29.事件冒泡: |--1.由外向内,捕获事件:记录哪级元素有什么事件 |--2.由内向外,冒泡执行:按记录的顺序由内向外执行 取消冒泡: |--1.获得事件对象!--event onclick="func(event)"--其中event和this都是关键字,表示事件对象 func(e)--此时e就是事件对象 |--2.取消冒泡:e.cancelBubble=true; 何时用:如果大量子元素拥有相同事件,应将相同事件统一定义在1个父元素上1次即可
目录: 第1章 窗口/框架与导航条设计 1 1.1 弹出窗口控制 2 实例001 打开新窗口显示广告信息 2 实例002 定时打开窗口 4 实例003 通过按钮创建窗口 5 实例004 自动关闭的广告窗口 6 实例005 控制弹出窗口居中显示 7 实例006 弹出的窗口之Cookie控制 9 实例007 为弹出的窗口加入关闭按钮 11 实例008 关闭弹出窗口时刷新父窗口 12 实例009 关闭IE主窗口时,不弹出询问对话框 13 1.2 弹出网页对话框 14 实例010 弹出网页模式对话框 14 实例011 弹出全屏显示的网页模式对话框 16 实例012 网页拾色器 18 实例013 日期选择器 21 1.3 窗口的动画效果 26 实例014 页面自动滚动 26 实例015 打开窗口特殊效果 27 实例016 动态显示窗口 29 实例017 慢慢放大的窗口 30 实例018 下降式浏览器 32 实例019 旋转的窗口 33 实例020 移动的窗口 34 实例021 震动的窗口 35 实例022 弹出广告窗口 36 1.4 窗口控制 37 实例023 窗口始终在最上面 38 实例024 窗口的最小化、最大化 39 实例025 频道方式窗口 41 实例026 全屏显示 42 实例027 设置窗口大小和位置 43 实例028 刷新当前页 44 实例029 自动最大化 45 实例030 自定义导航控制面板 46 实例031 根据用户分辨率自动调整窗口 48 1.5 窗口的其他效果 49 实例032 打开窗口时显示对话框 50 实例033 使窗口背景透明 50 实例034 立体窗口 52 实例035 动态标题栏 53 实例036 固定大小的窗口 54 1.6 框架的应用 55 实例037 框架集的嵌套 56 实例038 在网页中应用浮动框架 58 实例039 创建空白框架 60 实例040 居中显示框架页 62 1.7 无边框窗口 63 实例041 全屏显示无边框有滚动条的窗口 63 实例042 应用CSS+DIV实现指定尺寸无边框无滚动条窗口 65 实例043 应用JavaScript实现指定尺寸无边框无滚动条窗口 67 1.8 水平导航条应用 69 实例044 图片按钮导航条 69 实例045 导航条的动画效果 71 实例046 不用图片实现质感导航条 72 1.9 下拉菜单式导航条 73 实例047 二级导航菜单 74 实例048 半透明背景的下拉菜单 76 实例049 展开式导航条 80 实例050 用层制作下拉菜单1 81 实例051 用层制作下拉菜单2 84 1.10 侧导航条设计 86 实例052 自动隐藏式菜单 87 实例053 收缩式导航菜单 89 实例054 树状导航菜单 91 第2章 表单及表单元素 95 2.1 文本框/编辑框/隐藏域组件 96 实例055 获取文本框/编辑框/隐藏域的值 96 实例056 自动计算金额 97 实例057 设置文本框的只读属性 98 实例058 限制多行文本域输入的字符个数 100 实例059 自动选择文本框/编辑框中的文字 102 实例060 按下回车键时自动切换焦点 103 2.2 下拉列表/菜单 104 实例061 获取下拉列表/菜单的值 104 实例062 遍历多选择下拉列表 105 实例063 在下拉列表中进行多选移除 106 实例064 将数组中的数据添加到下拉菜单中 107 实例065 应用下拉菜单选择所要联机的网站 108 实例066 多级级联菜单 110 实例067 可以输入文字的下拉菜单 111 实例068 根据下拉菜单的值显示不同控件 112 实例069 分级下拉列表 113 2.3 单选按钮组 114 实例070 不提交表单获取单选按钮的值 114 实例071 选中单选按钮后显示其他表单元素 116 实例072 通过单选按钮控制其他表单元素是否可用 117 2.4 复选框 117 实例073 不提交表单获取复选框的值 118 实例074 控制复选框的全选或反选 118 实例075 只有一个复选框时控制复选框的全选或反选 119 2.5 密码域 120 实例076 让您的密码域更安全 120 实例077 不提交表单自动检测密码域是否相同 121 2.6 表单应用 122 实例078 通过JavaScript控制表单的提交与重置 122 实例079 带记忆功能的表单 123 实例080 防止表单重复提交 124 实例081 自动提交表单 125 实例082 通过for循环获取表单元素的中文名称 126 实例083 可以提交到不同处理页的表单 127 第3章 实用JavaScript函数 129 3.1 数据验证 130 实例084 通过正则表达式验证日期 130 实例085 验证输入的日期格式是否正确 132 实例086 检查表单元素是否为空 134 实例087 验证E-mail是否正确 135 实例088 通过正则表达式验证电话号码 137 实例089 验证输入的字符串是否为汉字 139 实例090 验证身份证号码 140 实例091 验证用户名和密码 142 实例092 验证车牌号码 144 实例093 验证网站地址 145 实例094 验证数量和金额 147 实例095 验证字符串是否以指定字符开头 149 实例096 限制输入字符串的长度 150 3.2 字符串处理 152 实例097 小写金额转换为大写金额 152 实例098 去除字符串中的空格 155 实例099 转换输入文本中的回车和空格 156 实例100 将数字字符串格式化为指定长度 158 实例101 把一个长数字分位显示 159 实例102 将RGB格式的颜色值转换为十六进制格式 161 实例103 将IP地址转换为对应的数值 163 实例104 从指定URL中提取文件名 164 3.3 随机函数 166 实例105 随机产生指定位数的验证码 166 实例106 生成随机字符串 167 3.4 日期与时间 169 实例107 显示长日期格式的系统日期 169 实例108 实时显示系统时间 171 第4章 日期和时间 173 4.1 日期时间显示 174 实例109 在标题栏中显示日期时间 174 实例110 使用toLocaleString()方法获取本地时间 176 实例111 全中文显示日期 176 实例112 在状态栏中显示日期时间 178 实例113 使用数组显示星期 179 实例114 在表格显示时间 180 实例115 退出页面时显示停留时间 181 实例116 显示用户在页面的停留时间 182 实例117 显示最后修改时间 183 4.2 日期时间算法 184 实例118 计算某一天是星期几 184 实例119 判断指定年份是否为闰年 186 实例120 计算从出生到现在度过的时间 187 实例121 返回两个日期之间的间隔小时 188 实例122 倒计时 190 实例123 访问时间限制 191 实例124 计步器 192 4.3 日期时间特效 194 实例125 分时问候 194 实例126 节日提示 195 实例127 倒影时钟 196 实例128 带阴影的时钟 199 实例129 动态石英钟 200 实例130 生日提醒器 203 实例131 数字时钟 205 实例132 各地时间表 206 实例133 位于页面顶层的时钟 209 第5章 文字特效 213 5.1 文字的颜色变换 214 实例134 简单文字变色 214 实例135 文字变色 215 实例136 变换的文字 216 实例137 描边文字 217 实例138 霓虹灯文字 218 实例139 追逐点亮的文字 219 实例140 萤光文字 220 实例141 发光文字的闪烁效果 221 实例142 文字的舞台灯光效果 223 实例143 制作彩色渐变文字动画 224 5.2 改变文字大小 226 实例144 文字伸缩 226 实例145 动荡的文字 227 实例146 文字伸展 228 实例147 文字逐个放大 230 实例148 自动改变大小 231 实例149 选择字体的大小 232 5.3 文字显示效果 234 实例150 文字渐隐渐现 234 实例151 文字虚幻变化 235 实例152 文字虚幻抖动 237 5.4 指定文字位置 238 实例153 将文字置于工作区左上角 238 实例154 右上角文字 239 实例155 鼠标移动文字 241 5.5 文字动态移动 242 实例156 文字自动滚屏 242 实例157 文字上下滚动 243 5.6 文字立体效果 244 实例158 文字的旋转 244 实例159 立体旋转文字 246 实例160 文字3D效果 248 5.7 文字动画效果 249 实例161 反弹文字 249 实例162 飞舞的文字 252 实例163 飞翔的文字 254 实例164 平面旋转的文字 257 实例165 输出文字 258 实例166 文字打字效果 259 实例167 文字抖动 261 实例168 指向文字时飞出星形标记 262 实例169 文字的抛出效果 264 5.8 文字特殊效果 265 实例170 波浪文字 265 实例171 梦幻文字效果 266 实例172 屏风文字 268 实例173 文字阴影 270 5.9 其他 270 实例174 随机显示文字 270 实例175 文字加密及解密 271 第6章 超级链接特效 275 6.1 超级链接样式 276 实例176 改变超级链接字体样式 276 实例177 当鼠标移动到超级链接时改变超级链接颜色 277 实例178 改变超级链接背景色 278 6.2 超级链接控制 279 实例179 建立E-mail超级链接 280 实例180 获取页面中的全部超级链接 281 实例181 将网站设为首页 282 实例182 单击鼠标右键自动链接到指定网站 283 实例183 单击超级链接将本页加入收藏夹 285 实例184 访问指定的链接地址 286 实例185 返回默认主页 287 实例186 导航链接 289 6.3 超级链接特效 291 实例187 快速闪动页面中的超级链接 291 实例188 滚动的超级链接提示信息 292 实例189 公告栏中显示超级链接 294 实例190 显示超级链接站点相关信息 295 实例191 显示超级链接的提示信息 296 实例192 半透明背景的超级链接提示 297 第7章 操作表格 299 7.1 表格的颜色效果 300 实例193 闪烁的表格边框 300 实例194 单元格边框变色 301 实例195 选中的行变色 302 7.2 对单元格的焦点进行控制 303 实例196 选定表格中的单元格 303 实例197 左右移动单元格的信息 304 实例198 通过键盘使单元格焦点任意移动 306 7.3 对表格的行、列进行修改 311 实例199 动态制作表格 311 实例200 动态生成行或列 313 实例201 删除表中的行 314 7.4 单元格的相关操作 316 实例202 隐藏显示单元格 316 实例203 编辑单元格中的文本信息 318 实例204 合并单元格 320 实例205 在表格中添加行及单元格 322 实例206 删除表中的单元格 324 7.5 表格的特殊效果 325 实例207 透明表格 326 实例208 限制表格的宽度 327 实例209 表格的标题 328 实例210 表格的外阴影 329 实例211 立体表格 329 实例212 虚线边框表格 330 实例213 表格作为分割线 332 实例214 表格向下展开 332 第8章 图形图像与多媒体 335 8.1 图片大小 336 实例215 打开自定义大小的图片 336 实例216 图片放大缩小 337 实例217 通过鼠标滚轮放大缩小图片 338 8.2 图片与鼠标相关操作 339 实例218 跟随鼠标移动的图片 340 实例219 可以左右拖动的图片 340 实例220 随意拖动图片 342 实例221 当鼠标经过图片时显示图片 344 实例222 改变图片获取焦点时的状态 345 实例223 抖动的图片 346 实例224 鼠标移动放大图片 347 8.3 图片与时间相关操作 349 实例225 定时隐藏图片 349 实例226 根据时间变换页面背景 350 实例227 使图片不停闪烁 352 实例228 上下跳动的图片 352 实例229 图片左右晃动 354 实例230 飘舞的变形图片 356 8.4 图片的动画效果 358 实例231 图片翻转效果 359 实例232 水波倒影特效 360 实例233 图片渐隐渐现 361 实例234 图片的探照灯效果 362 实例235 雷达扫描图片特效 363 实例236 在页面中旋转的图片 365 实例237 改变形状的图片 366 实例238 图片在页面浮动 367 实例239 随机变化的网页背景 369 8.5 选择头像 370 实例240 在列表中选择图片 370 实例241 在弹出的新窗口中选择图片 372 8.6 在页面中播放图片 374 实例242 幻灯片式播放图片 374 实例243 无间断的图片循环滚动效果 376 8.7 图片的其他效果 377 实例244 导航地图 377 8.8 播放音乐 378 实例245 为网页设置背景音乐 378 实例246 随机播放背景音乐 380 实例247 MIDI音乐选择 381 8.9 插入Flash动画 383 实例248 插入Flash动画 383 实例249 插入背景透明的Flash动画 384 8.10 播放视频文件 385 实例250 播放AVI文件 385 实例251 自制视频播放器 387 第9章 页面特效 391 9.1 页面背景效果 392 实例252 背景固定居中 392 实例253 背景图片纵向重复显示 393 实例254 通过按钮变换背景颜色 395 实例255 背景自动变色 396 实例256 百叶窗 396 实例257 渐隐渐显的背景颜色 398 实例258 页面缩小 399 实例259 页面上下打开效果 400 实例260 页面左右打开效果 402 实例261 页面溶解效果 404 9.2 特殊页面 406 实例262 页首页尾切换 406 实例263 调用下载页面 408 实例264 程序加载页面 409 实例265 颜色拾取器 411 9.3 广告页面 415 实例266 图片总置于顶端 415 实例267 随机显示广告 416 实例268 广告随滚动条漂移 418 9.4 页面动画效果 419 实例269 下雪 419 实例270 飘落的枫叶 421 实例271 下雨 423 实例272 背景的烟花效果 425 实例273 变色的圆圈 427 实例274 滚动的光环 429 实例275 星空极速飞入效果 430 实例276 闪烁的星星 432 9.5 其他 434 实例277 带密码的网页 434 实例278 页面左右滚动 435 实例279 动态移动的层 437 实例280 在页面中显示十字光标 438 第10章 状态栏特效 441 10.1 状态栏文字动画 442 实例281 使状态栏中的文字不停闪烁 442 实例282 文字从右向左依次弹出 443 实例283 文字从中间向两边展开 445 实例284 文字跑马灯特效 447 实例285 文字依次显示后快速收缩 449 实例286 文字的展开与收缩 451 实例287 状态栏中的文字依次弹出 452 10.2 其他 453 实例288 在状态栏显示固定自定义信息 453 实例289 在状态栏显示鼠标坐标 454 实例290 在状态栏显示特定的超级链接信息 456 第11章 报表与打印 459 11.1 Web打印 460 实例291 调用IE自身的打印功能实现打印 460 实例292 打印指定框架中的内容 461 实例293 利用WebBrowser打印 462 实例294 设置页眉页脚 463 11.2 利用Word打印报表 465 实例295 将页面中的表格导出到Word并打印 465 实例296 打开指定的Word文档并打印 467 实例297 在JSP中利用Word自动打印指定格式的会议记录 468 实例298 在ASP中利用Word自动打印指定格式的会议记录 470 实例299 在PHP中调用Word自动打印指定格式的会议记录 472 11.3 利用Excel打印报表 474 实例300 将Web页面中的数据导出到Excel 474 实例301 将Web页面中的数据导出到Excel并自动打印 476 11.4 利用CSS样式打印 478 实例302 利用CSS样式打印页面中的指定内容 478 实例303 利用CSS样式分页打印 479 11.5 套打邮寄产品单 482 实例304 打印汇款单 482 实例305 打印快递单 484 实例306 打印信封 485 第12章 网站安全 489 12.1 禁止用户复制网页内容 490 实例307 禁止用户复制网页内容(方法一) 490 实例308 禁止用户复制网页内容(方法二) 491 实例309 禁止网页另存为 492 12.2 禁止用户刷新屏幕 493 实例310 屏蔽IE主菜单 493 实例311 屏蔽键盘相关事件 494 实例312 屏蔽鼠标右键 496 12.3 登录页面 497 实例313 具有浏览器检测功能的登录页面 497 实例314 防止SQL注入的登录页面 498 实例315 带验证码的登录页面 500 12.4 其他 501 实例316 使用Script Encoder加密工具加密 501 第13章 HTML/CSS样式 503 13.1 页面效果 504 实例317 统一站内网页风格 504 实例318 设置超级链接文字的样式 508 实例319 网页换肤 509 实例320 滚动文字 512 实例321 制作渐变背景 513 13.2 表格样式 514 实例322 只有外边框的表格 515 实例323 彩色外边框的表格 516 实例324 控制表格指定外边框不显示 518 实例325 背景颜色渐变的表格 520 实例326 表格隔行变色 521 13.3 鼠标及滚动条样式 522 实例327 显示自定义鼠标形状 522 实例328 动画光标 524 实例329 制作彩色滚动条 525 13.4 文字及列表样式 527 实例330 应用删除线样式标记商品特价 527 实例331 在文字上方标注说明标记 528 实例332 指定图标的列表项 529 13.5 文字滤镜特效 530 实例333 文字的发光效果 531 实例334 文字的阴影效果 532 实例335 文字的渐变阴影效果 533 实例336 文字的图案填充效果 534 实例337 文字的探照灯效果 535 实例338 文字的闪烁效果 537 实例339 文字的空心效果 538 实例340 文字的浮雕效果 539 实例341 文字的阳文效果 540 实例342 文字的雪雕效果 541 实例343 火焰字 542 实例344 文字扭曲动画 544 13.6 图片滤镜特效 545 实例345 图片的半透明效果 545 实例346 图片的模糊效果 546 实例347 图片的水波纹特效 547 实例348 图片的灰度效果 548 实例349 图片的动态说明文字 549 第14章 JavaScript与XML 553 14.1 读取XML文件 554 实例350 使用XML DOM对象读取XML文件 554 实例351 使用XMLHttpRequest对象读取XML文件 557 14.2 显示XML文档 559 实例352 使用CSS显示XML文档 559 实例353 使用XSL显示XML文档 562 实例354 使用IE XML数据岛输出XML文档 564 14.3 操作XML 565 实例355 用JavaScript控制XML文档的分页显示 565 实例356 通过操作XML数据岛实现添加、删除留言信息 567 第15章 JavaScript与ASP结合 573 15.1 弹出窗口/对话框控制 574 实例357 关闭弹出窗口时刷新父窗口 574 实例358 打开新窗口显示详细信息 575 实例359 弹出网页模式对话框 577 实例360 日期选择器 580 实例361 弹出提示对话框并重定向网页 584 实例362 打开指定大小的新窗口并居中显示 586 15.2 弹出确认对话框 588 实例363 删除数据前弹出确认对话框 588 实例364 安全退出前弹出确认对话框 590 15.3 其他 591 实例365 远程获取其他网页情报 591 实例366 树状导航菜单 594 实例367 使用XML实现不刷新页面查询数据 596 第16章 JavaScriptJSP结合 601 16.1 窗口与对话框 602 实例368 弹出提示对话框并重定向网页 602 实例369 打开新窗口显示详细信息 604 实例370 打开指定大小的新窗口并居中显示 605 实例371 弹出网页模式对话框 607 实例372 关闭弹出窗口时刷新父窗口 609 16.2 无刷新技术 611 实例373 无刷新的用户名检测 611 实例374 无刷新的级联下拉列表 614 实例375 使用XML实现不刷新页面查询数据 616 16.3 调用与控制 619 实例376 将查询结果导出到Word 619 实例377 调用Excel 621 实例378 调用PowerPoint 622 16.4 其他 623 实例379 树状导航菜单 623 第17章 JavaScript与ASP.NET结合 627 17.1 窗口与对话框 628 实例380 使用JavaScript脚本弹出对话框 628 实例381 打开新窗口显示详细信息 629 实例382 关闭弹出窗口刷新父窗口 631 实例383 弹出网页模式对话框 633 实例384 弹出全屏显示网页 635 17.2 其他 637 实例385 自动隐藏式菜单 637 第18章 JavaScript与PHP结合 641 18.1 窗口与对话框 642 实例386 弹出提示对话框并重定向网页 642 实例387 关闭弹出窗口时自动刷新父窗口 643 实例388 在弹出的网页模式对话框中选择个性头像 645 实例389 时间选择器 647 实例390 弹出提示对话框并重定向网页 649 实例391 删除数据前弹出确认对话框 650 18.2 其他 651 实例392 树状导航菜单 651 第19章 综合应用 657 19.1 计算器 658 实例393 简单计算器 658 实例394 复杂计算器 662 19.2 日历 667 实例395 精美日历 668 实例396 带农历的日历 674 19.3 购物车 681 实例397 添加至购物车 682 实例398 查看购物车 684 实例399 修改商品购买数量 686 实例400 从购物车中移去指定商品 687 实例401 清空购物车 689 JavaScript程序开发范例宝典附录 691
《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、对Ajax的支持以及如何调试等。最后利用一个商品信息管理系统和一个企业任务管理系统,向读者演示了ExtJS在实际项目中的应用以及实现流程。   《精通JS脚本之ExtJS框架》附有配套光盘,提供了书中实例的源代码和视频教学文件。此外,读者还可以通过访问itzcn网站来获得即时在线帮助。   《精通JS脚本之ExtJS框架》可以作为Web开发的自学参考书,也可以作为RIA Web程序开发的培训教材。 第1章 JavaScript入门必备 1.1 JavaScript语言概述 1.1.1 JavaScript简介 1.1.2 JavaScript特点 1.1.3 JavaScript与Java 1.2 第一个JavaScript程序 1.2.1 嵌入JavaScript 1.2.2 链接外部JavaScript文件 1.2.3 注意事项 1.3 基础语法 1.3.1 数据类型 1.3.2 变量与常量 1.3.3 运算符 1.4 流程控制语句 1.4.1 if条件语句 1.4.2 switch条件语句 1.4.3 while循环语句 1.4.4 do while循环语句 1.4.5 for循环语句 1.4.6 for in循环语句 1.4.7 try catch finally语句 1.4.8 其他语句 第2章 JavaScript浏览器对象模型与事件处理 2.1 浏览器对象模型 2.1.1 文档对象 2.1.2 表单及其元素对象 2.1.3 浏览器信息对象 2.1.4 窗口对象 2.1.5 网址对象 2.1.6 历史记录对象 2.2 基本事件处理 2.3 2级DOM事件模型 2.3.1 事件传播 2.3.2 注册事件处理程序 2.3.3 event对象 2.4 常用事件 2.4.1 键盘事件 2.4.2 鼠标事件 2.4.3 页面事件 第3章 开始使用ExtJS 3.1 ExtJS概述 3.1.1 ExtJS简介 3.1.2 ExtJS中的基本概念 3.1.3 ExtJS与常见JavaScript库的介绍与对比 3.2 创建第一个程序 3.2.1 下载ExtJS 3.2.2 部署到开发工具中 3.2.3 编写HelloWorld.html 3.2.4 运行调试ExtJS 3.3 辅助开发 3.3.1 调试工具Firebug 3.3.2 开发利器Spket 第4章 ExtJS事件机制 4.1 设计模式——观察者模式 4.2 自定义事件 4.3 浏览器事件 4.4 ExtJS中的事件 4.4.1 Function.call()/apply()方法 4.4.2 函数的作用域 4.4.3 Ext.lib.Event事件 4.4.4 Ext.util.Observable事件 4.4.5 Ext.EventManager事件 4.4.6 Ext.EventObject事件 4.5 各种事件登记方式 4.5.1 传统式登记 4.5.2 内联式登记 4.5.3 Dom Level2登记 4.6 高级组件事件 4.7 ExtJS键盘事件 第5章 ExtJS组件 5.1 核心组件 5.1.1 ExtJS组件结构 5.1.2 Ext.Component 5.1.3 Ext.BoxComponent 5.1.4 Ext.Container 5.1.5 Ext.Panel 5.1.6 Ext.TabPanel 5.2 信息提示框组件 5.2.1 Ext.MessageBox简介 5.2.2 Ext.MessageBox.alert() 5.2.3 Ext.MessageBox.confirm() 5.2.4 Ext.MessageBox.prompt() 5.2.5 Ext.MessageBox.wait() 5.2.6 Ext.MessageBox.show() 5.2.7 Ext.MessageBox的其他功能 5.3 进度条组件 5.3.1 Ext.ProgressBar简介 5.3.2 手工模式的进度条 5.3.3 自动模式的进度条 5.3.4 自定义样式的进度条 5.4 工具栏和菜单栏 5.4.1 Ext.Toolbar简介 5.4.2 只包含按钮的简单工具栏 5.4.3 包含多种元素的复杂工具栏 5.4.4 Ext.menu.Menu简介 5.4.5 最简单的菜单栏 5.4.6 创建三级或多级菜单 5.4.7 具有选择框的菜单 第6章 页面元素与模板 6.1 构成用户界面的元素 6.2 获取页面元素 6.3 元素常见的使用方法 6.3.1 常见的“显示/隐藏”方法 6.3.2 常见的“内容控制”方法 6.3.3 常见的“操控DOM”方法 6.3.4 常见的“尺寸大小/定位”方法 6.3.5 常见的“特效动画”方法 6.3.6 DomHelper简介 6.4 DomQuery入门 6.4.1 元素选择符Selector 6.4.2 属性选择符Attributes Selectors 6.4.3 CSS值元素选择符 6.4.4 Ext.query与Ext.select 6.5 应用模板 6.5.1 Ext.Template 6.5.2 Ext.XTemplate 第7章 设计表单类布局 7.1 Form表单简介 7.1.1 Form表单的基本配置 7.1.2 ExtJS对Form表单的封装 7.2 ExtJS的表单组件 7.2.1 文本输入控件Ext.form.TextField 7.2.2 多行文本输入控件Ext.form.TextArea 7.2.3 单选框 7.2.4 复选框 7.2.5 下拉列表框 7.2.6 日期输入控件Ext.form.DateField 7.2.7 在线编辑器Ext.form.HtmlEditor 7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格 8.2 表格常用功能详解 8.2.1 主要属性功能 8.2.2 自定义列宽度 8.2.3 执行按列排序 8.2.4 解决中文排序 8.2.5 格式化显示日期类型数据 8.3 美化表格 8.4 设置表格背景颜色 8.5 显示行号和复选框 8.5.1 显示行号 8.5.2 引用复选框 第9章 表格的高级功能 9.1 表格视图——Ext.grid.GridView 9.2 表格分页 9.2.1 添加表格分页显示工具条 9.2.2 从后台脚本获得分页数据 9.2.3 在表格顶部显示分页工具条 9.2.4 实现前台分页效果 9.3 可编辑表格控件——EditorGrid 9.3.1 制作第一个EditorGrid 9.3.2 添加一行数据 9.3.3 保存修改结果 9.3.4 验证EditGrid中的数据 9.3.5 限制输入数据的类型 9.4 PropertyGrid属性表格控件 9.4.1 PropertyGrid简介 9.4.2 只读的PropertyGrid 9.4.3 对name列强制排序并获得value 9.4.4 自定义编辑器 9.5 分组表格控件——Group 9.5.1 分组表格简介 9.5.2 Ext.grid.GroupingView的配置操作 9.6 可拖放的表格 9.6.1 拖放改变表格的大小 9.6.2 在同一个表格里拖放 9.6.3 表格之间的拖放 9.6.4 表格与树之间的拖放 第10章 设计树状结构布局 10.1 TreePanel的基本使用 10.1.1 创建一棵树 10.1.2 为树生枝展叶 10.1.3 树形的配置 10.1.4 使用TreeLoader获得数据 10.1.5 读取本地JSON数据 10.2 树的事件 10.3 右键菜单 10.4 修改节点的默认图标 10.5 从节点弹出对话框 10.6 节点提示信息 10.7 为节点设置超链接 10.8 树形的拖放 10.8.1 节点拖放的3种形式 10.8.2 叶子不能append 10.8.3 判断拖放的目标 10.8.4 树之间的拖放 10.9 树形过滤器TreeFilter 10.10 利用TreeSorter对树进行排序 10.11 树形节点视图——Ext.tree.TreeNodeUI 10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout 11.1.3 卡片式布局——CardLayout 11.1.4 列布局——ColoumnLayout 11.1.5 锚点布局——AnchorLayout 11.1.6 自适应布局——FitLayout 11.1.7 ContainerLayout 11.2 与布局有关的其他知识 11.2.1 父类Ext.Container公共配置与xtype的概念 11.2.2 使用Viewport 11.2.3 实现表单元素横排 第12章 ExtJS对Ajax的支持 12.1 Ext.Ajax介绍 12.1.1 Ext.Ajax.request方法详解 12.1.2 Ext.Ajax.request操作示例 12.1.3 Ext.Ajax.request提交XML数据 12.2 Ext.Updater基础 12.2.1 Ext.Updater.update方法 12.2.2 Ext.Updater.update操作示例 12.3 利用Ajax优化Web应用框架 12.3.1 多级联动菜单 12.3.2 Ajax修改用户密码 12.3.3 自动保存的网络记事本 12.3.4 网页计算器 第13章 设计数据驱动模式 13.1 XML/JSON数据格式比较 13.2 容器类MixedCollection 13.3 数据存储基本单元Record与dataField 13.3.1 dataField 13.3.2 Record 13.4 数据存储store 13.4.1 数据载入 13.4.2 对数据进行排序 13.4.3 从store 中获取数据 13.4.4 更新store 中的数据 13.4.5 加载及显示数据 13.5 数据代理 13.5.1 Ext.data.DataProxy 13.5.2 Ext.data.MemoryProxy 13.5.3 Ext.data.HttpProxy 13.5.4 Ext.data.ScriptTagProxy 13.6 数据读取器 13.6.1 Ext.data.DataReader 13.6.2 Ext.data.ArrayReader 13.6.3 Ext.data.JsonReader 13.6.4 Ext.data.XmlReader 13.7 Ext.ux.DWR 13.7.1 Ext.data.DwrProxy 13.7.2 Ext.data.DWRTreeLoader 13.7.4 Web服务端配置 13.7.5 服务层接口 第14章 ExtJS扩展 14.1 利用Ext.extend实现继承 14.2 与ExtJS扩展相关的预备知识 14.2.1 定义命名空间 14.2.2 使用xtype 14.3 用户扩展和插件 14.3.1 编写自定义用户扩展 14.3.2 常用插件UploadDialog 14.3.3 常用插件ManagedIFrame 14.4 使用ExtJS制作Flash统计报表 14.4.1 柱状图 14.4.2 折线图 14.4.3 饼状图 14.4.4 柱状栈图 第15章 调试JavaScript与HTML 15.1 Firebug的基本使用 15.1.1 开启或关闭Firebug 15.1.2 控制台 15.2 Firebug的应用 15.2.1 源代码调试 15.2.2 CSS调试 15.2.3 脚本调试 15.3 跟踪网络传输状态 15.4 在脚本文件中加入调试命令 15.5 在IE中使用Firebug 15.5.1 前端调试利器DebugBar 15.5.2 IE下的优秀JavaScript调试工具Companion.JS 15.5.3 DebugBar和Companion.JS的基本操作 15.6 调试技巧 15.6.1 在Firebug中直接调试脚本 15.6.2 调试代码运行速度 15.6.3 查看对象属性 第16章 ExtJS案例:商品信息管理系统 16.1 商品信息管理系统功能介绍 16.2 数据库设计和实现 16.2.1 数据库概念结构设计 16.2.2 数据库表设计 16.3 为项目做好准备 16.4 登录界面 16.5 栏目加载 16.6 为项目换肤 16.7 商品信息管理 16.7.1 商品信息的查询 16.7.2 商品信息的添加 16.7.3 商品信息的删除 16.7.4 商品信息的更新 第17章 ExtJS案例:企业任务管理系统 17.1 系统概述 17.2 需求分析 17.3 数据库设计 17.4 员工任务管理 17.4.1 个人任务处理 17.4.2 个人资料编辑 17.5 主管任务管理 17.5.1 部门计划处理 17.5.2 部门人员管理 17.6 系统管理员权限分配
Javascript小技巧一箩筐 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode event.shiftKey event.altKey event.ctrlKey 事件返回值 event.returnValue 鼠标位置 event.x event.y 窗体活动元素 document.activeElement 绑定事件 document.captureEvents(Event.KEYDOWN); 访问窗体元素 document.all("txt").focus(); document.all("txt").select(); 窗体命令 document.execCommand 窗体COOKIE document.cookie 菜单事件 document.oncontextmenu 创建元素 document.createElement("SPAN"); 根据鼠标获得元素: document.elementFromPoint(event.x,event.y).tagName=="TD document.elementFromPoint(event.x,event.y).appendChild(ms) 窗体图片 document.images[索引] 窗体事件绑定 document.onmousedown=scrollwindow; 元素 document.窗体.elements[索引] 对象绑定事件 document.all.xxx.detachEvent("onclick",a); 插件数目 navigator.plugins 取变量类型 typeof($js_libpath) == "undefined" 下拉框 下拉框.options[索引] 下拉框.options.length 查找对象 document.getElementsByName("r1"); document.getElementById(id); 定时 timer=setInterval("scrollwindow()",delay); clearInterval(timer); UNCODE编码 escape() ,unescape 父对象 obj.parentElement(dhtml) obj.parentNode(dom) 交换表的行 TableID.moveRow(2,1) 替换CSS document.all.csss.href = "a.css"; 并排显示 display:inline 隐藏焦点 hidefocus=true 根据宽度换行 style="word-break:break-all" 自动刷新 <meta HTTP-EQUIV="refresh" CONTENT="8;URL=http://c98.yeah.net"> 简单邮件 <a href="mailto:[email protected]?subject=ccc&body=xxxyyy"> 快速转到位置 obj.scrollIntoView(true) 锚 <a name="first"> <a href="#first">anchors</a> 网页传递参数 location.search(); 可编辑 obj.contenteditable=true 执行菜单命令 obj.execCommand 双字节字符 /[^x00-xff]/ 汉字 /[u4e00-u9fa5]/ 让英文字符串超出表格宽度自动换行 word-wrap: break-word; word-break: break-all; 透明背景 <IFRAME src="1.htm" width=300 height=180 allowtransparency></iframe> 获得style内容 obj.style.cssText HTML标签 document.documentElement.innerHTML 第一个style标签 document.styleSheets[0] style标签里的第一个样式 document.styleSheets[0].rules[0] 防止点击空链接时,页面往往重置到页首端。 <a href="javascript:function()">word</a> 上一网页源 asp: request.servervariables("HTTP_REFERER") javascript: document.referrer 释放内存 CollectGarbage(); 禁止右键 document.oncontextmenu = function() { return false;} 禁止保存 <noscript><iframe src="*.htm"></iframe></noscript> 禁止选取<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()> 禁止粘贴 <input type=text onpaste="return false"> 地址栏图标 <link rel="Shortcut Icon" href="favicon.ico"> favicon.ico 名字最好不变16*16的16色,放虚拟目录根目录下 收藏栏图标 <link rel="Bookmark" href="favicon.ico"> 查看源码 <input type=button value=查看网页源代码 onclick="window.location = "view-source:"+ "http://www.csdn.net/""> 关闭输入法 <input style="ime-mode:disabled"> 自动全选 <input type=text name=text1 value="123" onfocus="this.select()"> ENTER键可以让光标移到下一个输入框 <input onkeydown="if(event.keyCode==13)event.keyCode=9"> 文本框的默认值 <input type=text value="123" onfocus="alert(this.defaultValue)"> title换行 obj.title = "123&#13sdfs&#32" 获得时间所代表的微秒 var n1 = new Date("2004-10-10".replace(/-/g, "/")).getTime() 窗口是否关闭 win.closed checkbox扁平 <input type=checkbox style="position: absolute; clip:rect(5px 15px 15px 5px)"><br> 获取选中内容 document.selection.createRange().duplicate().text 自动完成功能 <input type=text autocomplete=on>打开该功能 <input type=text autocomplete=off>关闭该功能 窗口最大化 <body onload="window.resizeTo(window.screen.width - 4,window.screen.height-50);window.moveTo(-4,-4)"> 无关闭按钮IE window.open("aa.htm", "meizz", "fullscreen=7"); 统一编码/解码 alert(decodeURIComponent(encodeURIComponent("http://你好.com?as= hehe"))) encodeURIComponent对":"、"/"、";" 和 "?"也编码 表格行指示 <tr onmouseover="this.bgColor="#f0f0f0"" onmouseout="this.bgColor="#ffffff""> //各种尺寸 s += " 网页可见区域宽:"+ document.body.clientWidth; s += " 网页可见区域高:"+ document.body.clientHeight; s += " 网页可见区域高:"+ document.body.offsetWeight +" (包括边线的宽)"; s += " 网页可见区域高:"+ document.body.offsetHeight +" (包括边线的宽)"; s += " 网页正文全文宽:"+ document.body.scrollWidth; s += " 网页正文全文高:"+ document.body.scrollHeight; s += " 网页被卷去的高:"+ document.body.scrollTop; s += " 网页被卷去的左:"+ document.body.scrollLeft; s += " 网页正文部分上:"+ window.screenTop; s += " 网页正文部分左:"+ window.screenLeft; s += " 屏幕分辨率的高:"+ window.screen.height; s += " 屏幕分辨率的宽:"+ window.screen.width; s += " 屏幕可用工作区高度:"+ window.screen.availHeight; s += " 屏幕可用工作区宽度:"+ window.screen.availWidth; //过滤数字 <input type=text onkeypress="return event.keyCode>=48&&event.keyCode<=57||(this.value.indexOf(".")<0?event.keyCode==46:false)" onpaste="return !clipboardData.getData("text").match(/D/)" ondragenter="return false"> //特殊用途 <input type=button value=导入收藏夹 onclick="window.external.ImportExportFavorites(true,"http://localhost");"> <input type=button value=导出收藏夹 onclick="window.external.ImportExportFavorites(false,"http://localhost");"> <input type=button value=整理收藏夹 onclick="window.external.ShowBrowserUI("OrganizeFavorites", null)"> <input type=button value=语言设置 onclick="window.external.ShowBrowserUI("LanguageDialog", null)"> <input type=button value=加入收藏夹 onclick="window.external.AddFavorite("http://www.google.com/", "google")"> <input type=button value=加入到频道 onclick="window.external.addChannel("http://www.google.com/")"> <input type=button value=加入到频道 onclick="window.external.showBrowserUI("PrivacySettings",null)"> //不缓存 <META HTTP-EQUIV="pragma" CONTENT="no-cache"> <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"> <META HTTP-EQUIV="expires" CONTENT="0"> //正则匹配匹配中文字符的正则表达式: [u4e00-u9fa5] 匹配双字节字符(包括汉字在内):[^x00-xff] 匹配空行的正则表达式: [s| ]* 匹配HTML标记的正则表达式:/<(.*)>.*</1>|<(.*) />/ 匹配首尾空格的正则表达式:(^s*)|(s*$)(像vbscript那样的trim函数) 匹配Email地址的正则表达式:w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)* 匹配网址URL的正则表达式:http://([w-]+.)+[w-]+(/[w- ./?%&=]*)? 以下是例子: 利用正则表达式限制网页表单里的文本框输入内容: 用正则表达式限制只能输入中文:onkeyup="value=value.replace(/[^u4E00-u9FA5]/g,"")" onbeforepaste="clipboardData.setData("text",clipboardData.getData("text").replace(/[^u4E00-u9FA5]/g,""))" 1.用正则表达式限制只能输入全角字符: onkeyup="value=value.replace(/[^uFF00-uFFFF]/g,"")" onbeforepaste="clipboardData.setData("text",clipboardData.getData("text").replace(/[^uFF00-uFFFF]/g,""))" 2.用正则表达式限制只能输入数字:onkeyup="value=value.replace(/[^d]/g,"") "onbeforepaste="clipboardData.setData("text",clipboardData.getData("text").replace(/[^d]/g,""))" 3.用正则表达式限制只能输入数字和英文:onkeyup="value=value.replace(/[W]/g,"") "onbeforepaste="clipboardData.setData("text",clipboardData.getData("text").replace(/[^d]/g,""))" //消除图像工具栏 <IMG SRC="mypicture.jpg" HEIGHT="100px" WIDTH="100px" GALLERYIMG="false"> or <head> <meta http-equiv="imagetoolbar" content="no"> </head> //无提示关闭 function Close() { var ua=navigator.userAgent var ie=navigator.appName=="Microsoft Internet Explorer"?true:false if(ie) { var IEversion=parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE ")))) if(IEversion< 5.5) { var str = "<object id=noTipClose classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">" str += "<param name="Command" value="Close"></object>"; document.body.insertAdjacentHTML("beforeEnd", str); document.all.noTipClose.Click(); } else { window.opener =null; window.close(); } } else { window.close() } } //取得控件得绝对位置(1) <script language="javascript"> function getoffset(e) { var t=e.offsetTop; var l=e.offsetLeft; while(e=e.offsetParent) { t+=e.offsetTop; l+=e.offsetLeft; } var rec = new Array(1); rec[0] = t; rec[1] = l; return rec } </script> //获得控件的绝对位置(2) oRect = obj.getBoundingClientRect(); oRect.left oRect. //最小化,最大化,关闭 <object id=min classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"> <param name="Command" value="Minimize"></object> <object id=max classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"> <param name="Command" value="Maximize"></object> <OBJECT id=close classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"> <PARAM NAME="Command" value="Close"></OBJECT> <input type=button value=最小化 onclick=min.Click()> <input type=button value=最大化 onclick=max.Click()> <input type=button value=关闭 onclick=close.Click()> //光标停在文字最后 <script language="javascript"> function cc() { var e = event.srcElement; var r =e.createTextRange(); r.moveStart("character",e.value.length); r.collapse(true); r.select(); } </script> <input type=text name=text1 value="123" onfocus="cc()"> //页面进入和退出的特效 进入页面<meta http-equiv="Page-Enter" content="revealTrans(duration=x, transition=y)"> 推出页面<meta http-equiv="Page-Exit" content="revealTrans(duration=x, transition=y)"> 这个是页面被载入和调出时的一些特效。duration表示特效的持续时间,以秒为单位。transition表示使 用哪种特效,取值为1-23:   0 矩形缩小   1 矩形扩大   2 圆形缩小   3 圆形扩大   4 下到上刷新   5 上到下刷新   6 左到右刷新   7 右到左刷新   8 竖百叶窗   9 横百叶窗   10 错位横百叶窗   11 错位竖百叶窗   12 点扩散   13 左右到中间刷新   14 中间到左右刷新   15 中间到上下   16 上下到中间   17 右下到左上   18 右上到左下   19 左上到右下   20 左下到右上   21 横条   22 竖条   23 //网页是否被检索 <meta name="ROBOTS" content="属性值">   其中属性值有以下一些:   属性值为"all": 文件将被检索,且页上链接可被查询;   属性值为"none": 文件不被检索,而且不查询页上的链接;   属性值为"index": 文件将被检索;   属性值为"follow": 查询页上的链接;   属性值为"noindex": 文件不检索,但可被查询链接;   属性值为"nofollow": //打印分页 <p style="page-break-after:always">page1</p> <p style="page-break-after:always">page2</p> //设置打印 <object id="factory" style="display:none" viewastext classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=5,60,0,360" ></object> <input type=button value=页面设置 onclick="factory.printing.PageSetup()"> <input type=button value=打印预览 onclick="factory.printing.Preview()"> <script language=javascript> function window.onload() { // -- advanced features factory.printing.SetMarginMeasure(2) // measure margins in inches factory.printing.SetPageRange(false, 1, 3) // need pages from 1 to 3 factory.printing.printer = "HP DeskJet 870C" factory.printing.copies = 2 factory.printing.collate = true factory.printing.paperSize = "A4" factory.printing.paperSource = "Manual feed" // -- basic features factory.printing.header = "居左显示&b居中显示&b居右显示页码,第&p页/共&P页" factory.printing.footer = "(自定义页脚)" factory.printing.portrait = false factory.printing.leftMargin = 0.75 factory.printing.topMargin = 1.5 factory.printing.rightMargin = 0.75 factory.printing.bottomMargin = 1.5 } function Print(frame) { factory.printing.Print(true, frame) // print with prompt } </script> <input type=button value="打印本页" onclick="factory.printing.Print(false)"> <input type=button value="页面设置" onclick="factory.printing.PageSetup()"> <input type=button value="打印预览" onclick="factory.printing.Preview()"><br> <a href="http://www.meadroid.com/scriptx/docs/printdoc.htm?static" target=_blank>具体使用手册,更多信息,点这里</a> //自带的打印预览 WebBrowser.ExecWB(1,1) 打开 Web.ExecWB(2,1) 关闭现在所有的IE窗口,并打开一个新窗口 Web.ExecWB(4,1) 保存网页 Web.ExecWB(6,1) 打印 Web.ExecWB(7,1) 打印预览 Web.ExecWB(8,1) 打印页面设置 Web.ExecWB(10,1) 查看页面属性 Web.ExecWB(15,1) 好像是撤销,有待确认 Web.ExecWB(17,1) 全选 Web.ExecWB(22,1) 刷新 Web.ExecWB(45,1) 关闭窗体无提示 <style media=print> .Noprint{display:none;}<!--用本样式在打印时隐藏非打印项目--> .PageNext{page-break-after: always;}<!--控制分页--> </style> <object id="WebBrowser" width=0 height=0 classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"> </object> <center class="Noprint" > <input type=button value=打印 onclick=document.all.WebBrowser.ExecWB(6,1)> <input type=button value=直接打印 onclick=document.all.WebBrowser.ExecWB(6,6)> <input type=button value=页面设置 onclick=document.all.WebBrowser.ExecWB(8,1)> </p> <p> <input type=button value=打印预览 onclick=document.all.WebBrowser.ExecWB(7,1)> </center> //去掉打印时的页眉页脚 <script language="JavaScript"> var HKEY_Root,HKEY_Path,HKEY_Key; HKEY_Root="HKEY_CURRENT_USER"; HKEY_Path="\Software\Microsoft\Internet Explorer\PageSetup\"; //设置网页打印的页眉页脚为空 function PageSetup_Null() { try { var Wsh=new ActiveXObject("WScript.Shell"); HKEY_Key="header"; Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,""); HKEY_Key="footer"; Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,""); } catch(e){} } //设置网页打印的页眉页脚为默认值 function PageSetup_Default() { try { var Wsh=new ActiveXObject("WScript.Shell"); HKEY_Key="header"; Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&w&b页码,&p/&P"); HKEY_Key="footer"; Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&u&b&d"); } catch(e){} } </script> <input type="button" value="清空页码" onclick=PageSetup_Null()> <input type="button" value="恢复页码" onclick=PageSetup_Default()> //浏览器验证 function checkBrowser() { this.ver=navigator.appVersion this.dom=document.getElementById?1:0 this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0; this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0; this.ie4=(document.all && !this.dom)?1:0; this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0; this.ns4=(document.layers && !this.dom)?1:0; this.mac=(this.ver.indexOf("Mac") > -1) ?1:0; this.ope=(navigator.userAgent.indexOf("Opera")>-1); this.ie=(this.ie6 || this.ie5 || this.ie4) this.ns=(this.ns4 || this.ns5) this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns5 || this.ns4 || this.mac || this.ope) this.nbw=(!this.bw) return this; } //计算内容宽和高 <SCRIPT language="javascript"> function test(obj) { var range = obj.createTextRange(); alert("内容区宽度: " + range.boundingWidth + "px 内容区高度: " + range.boundingHeight + "px"); } </SCRIPT> <BODY> <Textarea id="txt" height="150">sdf</textarea><INPUT type="button" value="计算内容宽度" onClick="test(txt)"> </BODY> //无模式的提示框 function modelessAlert(Msg) { window.showModelessDialog("javascript:alert(""+escape(Msg)+"");window.close();","","status:no;resizable:no;help:no;dialogHeight:height:30px;dialogHeight:40px;"); } //屏蔽按键 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <noscript><meta http-equiv="refresh" content="0;url=about:noscript"></noscript> <title>屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键</title> </head> <body> <script language="Javascript"><!-- //屏蔽鼠标右键、Ctrl+N、Shift+F10、F11、F5刷新、退格键 //Author: meizz(梅花雨) 2002-6-18 function document.oncontextmenu(){event.returnValue=false;}//屏蔽鼠标右键 function window.onhelp(){return false} //屏蔽F1帮助 function document.onkeydown() { if ((window.event.altKey)&& ((window.event.keyCode==37)|| //屏蔽 Alt+ 方向键 ← (window.event.keyCode==39))) //屏蔽 Alt+ 方向键 → { alert("不准你使用ALT+方向键前进或后退网页!"); event.returnValue=false; } /* 注:这还不是真正地屏蔽 Alt+ 方向键, 因为 Alt+ 方向键弹出警告框时,按住 Alt 键不放, 用鼠标点掉警告框,这种屏蔽方法就失效了。以后若 有哪位高手有真正屏蔽 Alt 键的方法,请告知。*/ if ((event.keyCode==8) || //屏蔽退格删除键 (event.keyCode==116)|| //屏蔽 F5 刷新键 (event.ctrlKey && event.keyCode==82)){ //Ctrl + R event.keyCode=0; event.returnValue=false; } if (event.keyCode==122){event.keyCode=0;event.returnValue=false;} //屏蔽F11 if (event.ctrlKey && event.keyCode==78) event.returnValue=false; //屏蔽 Ctrl+n if (event.shiftKey && event.keyCode==121)event.returnValue=false; //屏蔽 shift+F10 if (window.event.srcElement.tagName == "A" && window.event.shiftKey) window.event.returnValue = false; //屏蔽 shift 加鼠标左键新开一网页 if ((window.event.altKey)&&(window.event.keyCode==115)) //屏蔽Alt+F4 { window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px"); return false; } } </script> 屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键 </body> </html> //屏蔽打印 <style> @media print{ * {display:none} } </style> //移动的图层,拖动 1.<span style="position:absolute;width:200;height:200;background:red" onmousedown=MouseDown(this) onmousemove=MouseMove() onmouseup=MouseUp()>meizz</span> <script language=javascript> var Obj; function MouseDown(obj) { Obj=obj; Obj.setCapture(); Obj.l=event.x-Obj.style.pixelLeft; Obj.t=event.y-Obj.style.pixelTop; } function MouseMove() { if(Obj!=null) { Obj.style.left = event.x-Obj.l; Obj.style.top = event.y-Obj.t; } } function MouseUp() { if(Obj!=null) { Obj.releaseCapture(); Obj=null; } } </script> 2. <div id="myDiv" src="logo.gif" ondrag="doDrag();" onmouseover="this.style.cursor="hand"" style="position:absolute;left=100;top=100;" onmousedown="doMouseDown();"> <a href="#" onclick="return false"><h1>wlecome</h1></a> </div> <script language="JavaScript" type="text/javascript"> var orgMouseX; var orgMouseY; var orgObjX; var orgObjY; function doDrag() { var myObject=document.all.myDiv; var x=event.clientX; var y=event.clientY; myObject.style.left=x-(orgMouseX-orgObjX); myObject.style.top=y-(orgMouseY-orgObjY); } function doMouseDown() { orgMouseX=event.clientX; orgMouseY=event.clientY; orgObjX=parseInt(document.all.myDiv.style.left); orgObjY=parseInt(document.all.myDiv.style.top); } </script> //文档状态改变 <iframe src="a.html" id="f" name="f" scrolling="no" frameborder=0 marginwidth=0 marginheight=0></iframe> <script> var doc=window.frames["f"].document; function s(){ if (doc.readyState=="complete"){ document.all.f.style.height=doc.body.scrollHeight document.all.f.style.width=doc.body.scrollWidth } } doc.onreadystatechange=s </script> //刷新后不变的文本框 <HTML> <HEAD> <META NAME="save" CONTENT="history"> <STYLE> .sHistory {behavior:url(#default#savehistory);} </STYLE> </HEAD> <BODY> <INPUT class=sHistory type=text id=oPersistInput> </BODY> </HTML> //访问剪贴板 (1)拖拽访问 event.dataTransfer.setData("URL", oImage.src); sImageURL = event.dataTransfer.getData("URL") (2)普通访问 window.clipboardData.setData("Text",oSource.innerText); window.clipboardData.getData("Text"); //操作COOKIE function SetCookie(sName, sValue) { document.cookie = sName + "=" + escape(sValue) + "; "; } function GetCookie(sName) { var aCookie = document.cookie.split("; "); for (var i=0; i < aCookie.length; i++) { var aCrumb = aCookie[i].split("="); if (sName == aCrumb[0]) return unescape(aCrumb[1]); } } function DelCookie(sName) { document.cookie = sName + "=" + escape(sValue) + "; expires=Fri, 31 Dec 1999 23:59:59 GMT;"; } //setTimeout增加参数 <script> var _st = window.setTimeout; window.setTimeout = function(fRef, mDelay) { if(typeof fRef == "function"){ var argu = Array.prototype.slice.call(arguments,2); var f = (function(){ fRef.apply(null, argu); }); return _st(f, mDelay); } return _st(fRef,mDelay); } function test(x){ alert(x); } window.setTimeout(test,1000,"fason"); </script> //自定义的apply,call Function.prototype.apply = function (obj, argu) { if (obj) obj.constructor.prototype._caller = this; var argus = new Array(); for (var i=0;i<argu.length;i++) argus[i] = "argu[" + i + "]"; var r; eval("r = " + (obj ? ("obj._caller(" + argus.join(",") + ");") : ("this(" + argus.join(",") + ");"))); return r; }; Function.prototype.call = function (obj) { var argu = new Array(); for (var i=1;i<arguments.length;i++) argu[i-1] = arguments[i]; return this.apply(obj, argu); }; //下载文件 function DownURL(strRemoteURL,strLocalURL) { try { var xmlHTTP=new ActiveXObject("Microsoft.XMLHTTP"); xmlHTTP.open("Get",strRemoteURL,false); xmlHTTP.send(); var adodbStream=new ActiveXObject("ADODB.Stream"); adodbStream.Type=1;//1=adTypeBinary adodbStream.Open(); adodbStream.write(xmlHTTP.responseBody); adodbStream.SaveToFile(strLocalURL,2); adodbStream.Close(); adodbStream=null; xmlHTTP=null; } catch(e) { window.confirm("下载URL出错!"); } //window.confirm("下载完成."); } //检验连接是否有效 function getXML(URL) { var xmlhttp = new ActiveXObject("microsoft.xmlhttp"); xmlhttp.Open("GET",URL, false); try { xmlhttp.Send(); } catch(e){} finally { var result = xmlhttp.responseText; if(result) { if(xmlhttp.Status==200) { return(true); } else { return(false); } } else { return(false); } } } //POST代替FORM <SCRIPT language="VBScript"> Function URLEncoding(vstrIn) strReturn = "" For i = 1 To Len(vstrIn) ThisChr = Mid(vStrIn,i,1) If Abs(Asc(ThisChr)) < &HFF Then strReturn = strReturn & ThisChr Else innerCode = Asc(ThisChr) If innerCode < 0 Then innerCode = innerCode + &H10000 End If Hight8 = (innerCode And &HFF00) &HFF Low8 = innerCode And &HFF strReturn = strReturn & "%" & Hex(Hight8) & "%" & Hex(Low8) End If Next URLEncoding = strReturn End Function Function bytes2BSTR(vIn) strReturn = "" For i = 1 To LenB(vIn) ThisCharCode = AscB(MidB(vIn,i,1)) If ThisCharCode < &H80 Then strReturn = strReturn & Chr(ThisCharCode) Else NextCharCode = AscB(MidB(vIn,i+1,1)) strReturn = strReturn & Chr(CLng(ThisCharCode) * &H100 + CInt(NextCharCode)) i = i + 1 End If Next bytes2BSTR = strReturn End Function dim strA,oReq strA = URLEncoding("submit1=Submit&text1=中文") set oReq = CreateObject("MSXML2.XMLHTTP") oReq.open "POST","http://ServerName/VDir/TstResult.asp",false oReq.setRequestHeader "Content-Length",Len(strA) oReq.setRequestHeader "CONTENT-TYPE","application/x-www-form-urlencoded" oReq.send strA msgbox bytes2BSTR(oReq.responseBody) </SCRIPT> //readyState是xmlhttp返回数据的进度,0=载入中,1=未初始化,2=已载入,3=运行中,4=完成 //组件是否安装 isComponentInstalled("{6B053A4B-A7EC-4D3D-4567-B8FF8A1A5739}", "componentID")) //检查网页是否存在 function CheckURL(URL) { var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.Open("GET",URL, false); try { xmlhttp.Send(); var result = xmlhttp.status; } catch(e) {return(false); } if(result==200) { return true; } xmlhttp = null; return false; } //连接数据库 <script language="javascript"> //用 JavaScript 写服务器端连接数据库的代码示例 var conn = new ActiveXObject("ADODB.Connection"); conn.Open("Provider=SQLOLEDB.1; Data Source=localhost; User ID=sa; " +"Password=; Initial Catalog=pubs"); var rs = new ActiveXObject("ADODB.Recordset"); var sql="select * from authors"; rs.open(sql, conn); shtml = "<table width="100%" border=1>"; shtml +="<tr bgcolor="#f4f4f4"><td>au_id</td><td>au_lname</td><td>au_fname</td><td>phone</td><td>address</td><td> city</td><td>state</td><td>zip</td></tr>"; while(!rs.EOF) { shtml += "<tr><td>" + rs("au_id") + "</td><td>" + rs("au_lname") + "</td><td>" + rs("au_fname") + "</td><td>" + rs("phone") + "</td><td>" + rs("address") + "</td><td>" + rs("city") + "</td><td>" + rs("state") + "</td><td>" + rs("zip") + "</td></tr>"; rs.moveNext; } shtml += "</table>"; document.write(shtml); rs.close(); rs = null; conn.close(); conn = null; </script> //使用数据岛 <html> <body> srno:<input type=text datasrc=#xmldate DataFLD=srno size="76"><BR> times:<input type=text datasrc=#xmldate DataFLD=times size="76"><BR> <input id="first" TYPE=button value="<< 第一条记录" onclick="xmldate.recordset.moveFirst()"> <input id="prev" TYPE=button value="<上一条记录" onclick="xmldate.recordset.movePrevious()"> <input id="next" TYPE=button value="下一条记录>" onclick="xmldate.recordset.moveNext()"> <input id="last" TYPE=button value="最后一条记录>>" onclick="xmldate.recordset.moveLast()"> <input id="Add" TYPE=button value="添加新记录" onclick="xmldate.recordset.addNew()"> <XML ID="xmldate"> <infolist> <info ><srno>20041025-01</srno><times>null</times></info> <info ><srno>20041101-09</srno><times>2004年10月1日2点22分0秒</times></info> </infolist> </XML> </body> </html> //获得参数 <body> <a href="javascript:location.href=location.href + "?a=1&b=2"">search</a> <script language="JavaScript"> <!-- var a = location.search.substr(1); if(a.length>0) { var re = /([^&]*?)=([^&]*)/g var s = a.match(re); for(var i= 0;i<s.length;i++) { alert(s[i]); alert(s[i].split("=")[1]); } } //--> </script> </body> //可编辑SELECT <input type=text name=re_name style="width:100px;height:21px;font-size:10pt;"><span style="width:18px;border:0px solid red;"><select name="r00" style="margin-left:-100px;width:118px; background-color:#FFEEEE;" onChange="document.all.re_name.value=this.value;"> <option value="1">11111111<option> <option value="2">222222</option> <option value="3">333333</option> </select> </span> //设置光标位置 function getCaret(textbox) { var control = document.activeElement; textbox.focus(); var rang = document.selection.createRange(); rang.setEndPoint("StartToStart",textbox.createTextRange()) control.focus(); return rang.text.length; } function setCaret(textbox,pos) { try { var r =textbox.createTextRange(); r.moveStart("character",pos); r.collapse(true); r.select(); } catch(e) {} } function selectLength(textbox,start,len) { try { var r =textbox.createTextRange(); r.moveEnd("character",len-(textbox.value.length-start)); r.moveStart("character",start); r.select(); } catch(e) {//alert(e.description)} } function insertAtCaret(textbox,text) { textbox.focus(); document.selection.createRange().text = text; } //页内查找 function findInPage(str) { var txt, i, found,n = 0; if (str == "") { return false; } txt = document.body.createTextRange(); for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) { txt.moveStart("character", 1); txt.moveEnd("textedit"); } if (found) { txt.moveStart("character", -1); txt.findText(str); txt.select(); txt.scrollIntoView(); n++; } else { if (n > 0) { n = 0; findInPage(str); } else { alert(str + "... 您要找的文字不存在。 请试着输入页面中的关键字再次查找!"); } } return false; } //书 http://www.itpub.net/attachment.php?s=&postid=1894598 http://www.wrclub.net/down/listdown.aspx?id=1341//操作EXECL <script language="javascript"> function jStartExcel() { var xls = new ActiveXObject ( "Excel.Application" ); xls.visible = true; var newBook = xls.Workbooks.Add; newBook.Worksheets.Add; newBook.Worksheets(1).Activate; xls.ActiveWorkBook.ActiveSheet.PageSetup.Orientation = 2; xls.ActiveWorkBook.ActiveSheet.PageSetup.PaperSize = 5; newBook.Worksheets(1).Columns("A").columnwidth=50; newBook.Worksheets(1).Columns("A").WrapText = true; newBook.Worksheets(1).Columns("B").columnwidth=50; newBook.Worksheets(1).Columns("B").WrapText = true; newBook.Worksheets(1).Range("A1:B1000").NumberFormat = "0"; newBook.Worksheets(1).Range("A1:B1000").HorizontalAlignment = -4131; newBook.Worksheets(1).Cells(1,1).Interior.ColorIndex="15"; newBook.Worksheets(1).Cells(1,1).value="First Column, First Cell"; newBook.Worksheets(1).Cells(2,1).value="First Column, Second Cell"; newBook.Worksheets(1).Cells(1,2).value="Second Column, First Cell"; newBook.Worksheets(1).Cells(2,2).value="Second Column, Second Cell"; newBook.Worksheets(1).Name="My First WorkSheet"; } </script> //自定义提示条 <a href="#" title="这是提示">tip</a> <script Language="JavaScript"> //***********默认设置定义.********************* tPopWait=50;//停留tWait豪秒后显示提示。 tPopShow=5000;//显示tShow豪秒后关闭提示 showPopStep=20; popOpacity=99; //***************内部变量定义***************** sPop=null; curShow=null; tFadeOut=null; tFadeIn=null; tFadeWaiting=null; document.write("<style type="text/css"id="defaultPopStyle">"); document.write(".cPopText { background-color: #F8F8F5;color:#000000; border: 1px #000000 solid;font-color: font-size: 12px; padding-right: 4px; padding-left: 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter: Alpha(Opacity=0)}"); document.write("</style>"); document.write("<div id="dypopLayer" style="position:absolute;z-index:1000;" class="cPopText"></div>"); function showPopupText(){ var o=event.srcElement; MouseX=event.x; MouseY=event.y; if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""}; if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""}; if(o.dypop!=sPop) { sPop=o.dypop; clearTimeout(curShow); clearTimeout(tFadeOut); clearTimeout(tFadeIn); clearTimeout(tFadeWaiting); if(sPop==null || sPop=="") { dypopLayer.innerHTML=""; dypopLayer.style.filter="Alpha()"; dypopLayer.filters.Alpha.opacity=0; } else { if(o.dyclass!=null) popStyle=o.dyclass else popStyle="cPopText"; curShow=setTimeout("showIt()",tPopWait); } } } function showIt(){ dypopLayer.className=popStyle; dypopLayer.innerHTML=sPop; popWidth=dypopLayer.clientWidth; popHeight=dypopLayer.clientHeight; if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24 else popLeftAdjust=0; if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24 else popTopAdjust=0; dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust; dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust; dypopLayer.style.filter="Alpha(Opacity=0)"; fadeOut(); } function fadeOut(){ if(dypopLayer.filters.Alpha.opacity<popOpacity) { dypopLayer.filters.Alpha.opacity+=showPopStep; tFadeOut=setTimeout("fadeOut()",1); } else { dypopLayer.filters.Alpha.opacity=popOpacity; tFadeWaiting=setTimeout("fadeIn()",tPopShow); } } function fadeIn(){ if(dypopLayer.filters.Alpha.opacity>0) { dypopLayer.filters.Alpha.opacity-=1; tFadeIn=setTimeout("fadeIn()",1); } } document.onmouseover=showPopupText; </script> //插入文字 document.onclick =function(){ var oSource = window.event.srcElement; if(oSource.tagName!="DIV") return false; var sel = document.selection; if (sel!=null) { var rng = sel.createRange(); if (rng!=null) rng.pasteHTML("<font color=red>插入文字</font>"); } } //netscapte下操作xml doc = new ActiveXObject("Msxml2.DOMDocument"); doc = new ActiveXObject("Microsoft.XMLDOM") ->> doc = (new DOMParser()).parseFromString(sXML,"text/xml") //判断键值 <html> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <head> <script language="javascript"> var ie =navigator.appName=="Microsoft Internet Explorer"?true:false; function keyDown(e) { if(!ie) { var nkey=e.which; var iekey="现在是ns浏览器"; var realkey=String.fromCharCode(e.which); } if(ie) { var iekey=event.keyCode; var nkey="现在是ie浏览器"; var realkey=String.fromCharCode(event.keyCode); if(event.keyCode==32){realkey="" 空格""} if(event.keyCode==13){realkey="" 回车""} if(event.keyCode==27){realkey="" Esc""} if(event.keyCode==16){realkey="" Shift""} if(event.keyCode==17){realkey="" Ctrl""} if(event.keyCode==18){realkey="" Alt""} } alert("ns浏览器中键值:"+nkey+" "+"ie浏览器中键值:"+iekey+" "+"实际键为"+realkey); } document.onkeydown = keyDown; </script> </head> <body> //Javascript Document. <hr> <center> <h3>请按任意一个键。。。。</h3> </center> </body> </html> //禁止FSO 1.注销组件 regsvr32 /u scrrun.dll 2.修改PROGID HKEY_CLASSES_ROOTScripting.FileSystemObject Scripting.FileSystemObject 3.对于使用object的用户,修改HKEY_CLASSES_ROOTScripting. //省略号 <DIV STYLE="width: 120px; height: 50px; border: 1px solid blue; overflow: hidden; text-overflow:ellipsis"> <NOBR>就是比如有一行文字,很长,表格内一行显示不下.</NOBR> </DIV> //检测media play版本 <IE:clientCaps ID="oClientCaps" style="{behavior:url(#default#clientcaps)}" /> <SCRIPT> var flash=""; WMPVersion= oClientCaps.getComponentVersion("{22D6F312-B0F6-11D0-94AB-0080C74C7E95}","ComponentID"); if (WMPVersion != "") { flash = ""; var version = WMPVersion.split(","); var i; for (i = 0; i < version.length; i++) { if (i != 0) flash += "."; flash += version[i]; } document.write("您的Windows Media Player 版本是:"+flash+"<p>"); } </SCRIPT> //图象按比例 <script language="JavaScript"> <!-- //图片按比例缩放 var flag=false; function DrawImage(ImgD){ var image=new Image(); var iwidth = 80; //定义允许图片宽度 var iheight = 80; //定义允许图片高度 image.src=ImgD.src; if(image.width>0 && image.height>0){ flag=true; if(image.width/image.height>= iwidth/iheight){ if(image.width>iwidth){ ImgD.width=iwidth; ImgD.height=(image.height*iwidth)/image.width; }else{ ImgD.width=image.width; ImgD.height=image.height; } ImgD.alt=image.width+"×"+image.height; } else{ if(image.height>iheight){ ImgD.height=iheight; ImgD.width=(image.width*iheight)/image.height; }else{ ImgD.width=image.width; ImgD.height=image.height; } ImgD.alt=image.width+"×"+image.height; } } } //--> </script> <img src=".." onload = "DrawImage(this)"> //细线SELECT function getComputerName() { var objWMIService = GetObject("Winmgmts:rootcimv2"); for(e = new Enumerator(objWMIService) ; !e.atEnd() ; e.moveNext()) { var getComputer = e.item(); return getComputer.Name; } } //条件编译 <script language=javascript> /*@cc_on @*/ /*@if (@_win32 && @_jscript_version>5) function window.confirm(str) { execScript("n = msgbox(""+ str +"", 257)", "vbscript"); return(n == 1); } @end @*/ </script> //取得innerText <SCRIPT LANGUAGE="JavaScript"> <!-- var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.4.0"); var currNode; xmlDoc.async = false; xmlDoc.async = false; xmlDoc.loadXML("<TABLENAME> 你好你阿三 大法 司法等四 </TABLENAME>"); currNode = xmlDoc.documentElement; var s = currNode.xml; var r = /<([^>s]*?)[^>]*?>([^<]*?)</1>/ var b = s.replace(r,"$2"); alert(b); //--> </SCRIPT> //mergeAttributes 复制所有读/写标签属性到指定元素。 <SCRIPT> function fnMerge(){ oSource.children[1].mergeAttributes(oSource.children[0]); } </SCRIPT> <SPAN ID=oSource> <DIV ID="oDiv" ATTRIBUTE1="true" ATTRIBUTE2="true" onclick="alert("click");" onmouseover="this.style.color="#0000FF";" onmouseout="this.style.color="#000000";" > This is a sample <B>DIV</B> element. </DIV> <DIV ID="oDiv2"> This is another sample <B>DIV</B> element. </DIV> </SPAN> <INPUT TYPE="button" VALUE="Merge Attributes" onclick="fnMerge()" > 以上内容可以随意转载,转载后请注名来源和出处! 原文链接:http://ttyp.cnblogs.com/archive/2004/11/15/63900.aspx <span style="border:1px solid #000000; position:absolute; overflow:hidden;" > <select style="margin:-2px;"> <option>1111</option> <option>11111111111111</option> <option>111111111</option> </select></span> //Import function Import() { for( var i=0; i<arguments.length; i++ ) { var file = arguments[i]; if ( file.match(/.js$/i)) document.write("<script type="text/javascript" src="" + file + ""></sc" + "ript>"); else document.write("<style type="text/css">@import "" + file + "" ;</style>"); } }; //js枚举 function getComputerName() { var objWMIService = GetObject("Winmgmts:rootcimv2"); for(e = new Enumerator(objWMIService) ; !e.atEnd() ; e.moveNext()) { var getComputer = e.item(); return getComputer.Name; } } //条件编译 <script language=javascript> /*@cc_on @*/ /*@if (@_win32 && @_jscript_version>5) function window.confirm(str) { execScript("n = msgbox(""+ str +"", 257)", "vbscript"); return(n == 1); } @end @*/ </script> //取得innerText <SCRIPT LANGUAGE="JavaScript"> <!-- var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.4.0"); var currNode; xmlDoc.async = false; xmlDoc.async = false; xmlDoc.loadXML("<TABLENAME> 你好你阿三 大法 司法等四 </TABLENAME>"); currNode = xmlDoc.documentElement; var s = currNode.xml; var r = /<([^>s]*?)[^>]*?>([^<]*?)</1>/ var b = s.replace(r,"$2"); alert(b); //--> </SCRIPT> //mergeAttributes 复制所有读/写标签属性到指定元素。 <SCRIPT> function fnMerge(){ oSource.children[1].mergeAttributes(oSource.children[0]); } </SCRIPT> <SPAN ID=oSource> <DIV ID="oDiv" ATTRIBUTE1="true" ATTRIBUTE2="true" onclick="alert("click");" onmouseover="this.style.color="#0000FF";" onmouseout="this.style.color="#000000";" > This is a sample <B>DIV</B> element. </DIV> <DIV ID="oDiv2"> This is another sample <B>DIV</B> element. </DIV> </SPAN> <INPUT TYPE="button" VALUE="Merge Attributes" onclick="fnMerge()" > 电子书制作:源码爱好者

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值