DHTML篇
文章平均质量分 78
yangdengfeng2003
这个作者很懒,什么都没留下…
展开
-
使用CheckBox的indeterminate属性的问题
我们在使用Windows XP的文件夹属性对话框时,会发现文件夹的Attributes分类里的Read-only和Hidden选项有时不是完全的checked或unchecked状态,而常常是一种虽然已被打勾但背景又是灰色的状态。其实这种不确定的CheckBox状态Web中也是可以表现的。 在Web页面中,我们可以使用来得到一个CheckBox控件。这个控件最常见的形式就是che原创 2007-05-05 19:09:00 · 3838 阅读 · 2 评论 -
使用DOM来创建页面元素的一些问题
在IE中使用DOM方式来动态创建页面元素的时候,我发现了一些问题。记录于此,如果您有好的意见欢迎提供,如果您也遇到此问题,希望能有助你解决。 对于动态HTML编程,IE实现了两套模型:一套是以操作innerHTML为主的狭义的DHTML,一套是以集合方式操作(appendChild)页面元素对象的DOM(Document Object Model)。DHTML方式(我本文说的DHTML原创 2007-05-05 19:22:00 · 723 阅读 · 0 评论 -
使用乱序标签来控制HTML的输出效果
在HTML的元素中,有一个比较特殊的元素form。我们用它来收集表单数据并提交给服务器,并且理论上说来它是没有任何的UI被呈现的。当然如果我们在body元素后紧跟一个form,这样一来似乎看不出来有什么UI呈现的问题,可是当form存在于别的元素之中时,就有问题了。 什么问题呢?看下面的示例,由于页面布局的需要,我需要控制页面的滚动条。我把body的滚动条隐藏掉,然后使用一个div元原创 2007-05-05 19:24:00 · 753 阅读 · 1 评论 -
HTML Elements 和 DHTML Objects
在查看MSDN时,我们会发现有的特性描述是针对HTML Elements的,而有的描述却是针对DHTML Objects的。虽然地球人都知道DHTML是指的Dynamicl HTML,那么它和HTML元素是什么关系呢?其实HTML是DHTML的一个完全的子集,任何的HTML元素也就是DHTML中的对象。 不过在MSDN中,M$对于HTML Elements和DHTML Objects原创 2007-05-05 19:24:00 · 505 阅读 · 0 评论 -
在使用optgroup时遇到的缺陷与修复
在IE6.0里微软提供对HTML4.0中定义元素optgroup的支持,不过当我今天使用optgroup时,居然发现其在事件处理上存在bug。该bug影响select元素上的onchange事件,具体表现及处理如下。 我们看一下这个带有optgroup的select事例: Option01 Item Option02 Item Option03 Item原创 2007-05-05 19:25:00 · 918 阅读 · 0 评论 -
滚动TextArea中内容到底部的BT方法
记得很久以前玩聊天室的时候,新的聊天内容被显示出来后,滚动条总是会滚动到聊天内容窗口的底部。不过那种聊天窗口一般都是使用frame/iframe制作的,我们可以使用其document对象的scrollTop属性来滚动窗口。如果使用TextArea来记录递增内容,怎么达到同样的效果呢? 今天下午一个同事说他的监控日志窗口是使用TextArea来做的,因为日志内容很多,也只有TextAr原创 2007-05-05 19:26:00 · 867 阅读 · 0 评论 -
精确地计算Web页面中滚动条的宽度
原来我一直以为Web页面中的滚动条宽度是不能精确确定的,因为用户自己可以在桌面属性中设置系统滚动条的宽度为任意整数。再加之上次在MyMsn的代码里看见M$程序员的注释,更加让我认为滚动条的宽度是不能精确计算地。但事实是怎么样的呢? 实际上对于HTML里面的容器元素,它们的长、宽之间存在这样的运算关系: width = border-left-width + clientWidt原创 2007-05-05 19:27:00 · 516 阅读 · 0 评论 -
在Web页面中控制其元素的选择状态
为了在Web页面上使用文本搜索,在文本框内实现选择效果,在页面上屏蔽选择状态等。我们需要使用脚本(如JavaScript)来精确的控制页面中UI元素的选择状态。下面从操作元素选择区和屏蔽元素被选择两个方面来说一说。 操作元素选择区,我们可以使用对应对象的select()方法选择页面内容,其中包括INPUT元素中的内容、TextRange对象中的文字和controlRange Colle原创 2007-05-05 19:28:00 · 648 阅读 · 1 评论 -
HTML中不支持静态Expando的元素
在使用脚本统一处理一批页面的时候,我希望通过被处理页面的TITLE元素取到文档的标题和我自定义的一些属性。这些附加的属性是我在服务器端通过Attributes集合添加的,可是运行的结果和我的期望老是相去甚远,怎么我在TITLE元素里写入的自定义属性老是空值呢? 客服端和服务器端代码分别是: ASPX:title id="title" runat="server">Que原创 2007-05-05 19:28:00 · 440 阅读 · 0 评论 -
使用onbeforeunload属性后的副作用
在使用博客园的编辑器编辑文章时,有一个挺体贴用户的功能,就是如果用户进入编辑器后,不是执行"POST"操作而要退出当前编辑器页面,我们会得到一个Alert窗口提示(如下图)。这个功能其实很简单,就是通过处理window、body或frameset对象或元素的onbeforeunload事件实现的。 这个unbeforeunload的具体用法我就不说了,反正几乎能引起当前页原创 2007-05-05 19:29:00 · 823 阅读 · 0 评论 -
在Option条目中填充前导空格的方法
在使用Web页面上的下拉列表框(SELECT element)显示数据列表时,有时我们会遇到有层次的数据条目。比如论坛中的子论坛和它的分类之间,以及一些具有包含关系的层次数据条目。使下拉列表框中,不同的level有一定的显示缩进将是非常友好的一种排版方式。 如果在HTML编写状态下,或在ASP等脚本语言中,制作这样的下拉列表窗口非常容易。我们知道空格" "在Option标签的前后原创 2007-05-05 19:30:00 · 634 阅读 · 0 评论 -
关于使用runtimeStyle属性问题讨论
当我们在IE中使用IE提供的DOM时,我们会发现关于style的相关属性有三个分组,它们分别是style、runtimeStyle和currentStyle。关于这个三种style的作用和基本用途,我曾经在这篇文章中有讲过,但随着越来越深入的使用,总算对怎么使用runtimeStyle属性有了一些自己的心得。 首先,runtimeStyle属性不是必需的,它的存在甚至远没有curre原创 2007-05-05 19:30:00 · 561 阅读 · 0 评论 -
DHTML Scriptlets 容器对象参考手册
DHTML小脚本容器对象参考手册,包含DHTML小脚本(Scriptlet)基准文档。在这里可以了解如下内容:1、窗口对象扩展:这些扩展内容是在编写小脚本时可以使用的属性与方法。 2、在小脚本容器对象中可用的属性与事件:在运行期间可以把它们与小脚本实例一起使用。 DHTML DHTML小脚本窗口对象扩展参考说明 在以一种DHTML小脚本创建脚本时,可以使用动态HTML(DHTML原创 2007-05-05 19:22:00 · 551 阅读 · 0 评论 -
JavaScript中的5种事件使用方式解说
为组件提供事件处理入口,可以极大的提高组件的封闭性,同时又能让组件很好的和外界通信。并且这也是我们已经习惯使用的一种开发模式,.NET、DHTML等都提供了一套完整的事件处理模型。下面是关于使用DHTML中事件的一个总结。 DHTML提供了3种事件的使用方式,它们分别是: 1、Inline HTML: 这是最简单最常用的事件绑定方式,不过这里onXXX的值为handle原创 2007-05-05 19:21:00 · 473 阅读 · 0 评论 -
获取Html元素在页面中的绝对位置及问题(1)
在Web开发中如果要想随心所欲的自由控制HTML元素,我们很多时候需要获得HTML元素在页面中的绝对位置(就是相对于浏览器的左上角坐标(0,0))。 这个位置的获取其实并不难,由于每个Html元素提供了一组和位置相关的属性,他们是: offsetLeft、offsetTop和offsetParent,还有两个带offset叫offsetWidth和offsetHeight,不过这原创 2007-05-05 19:13:00 · 491 阅读 · 0 评论 -
获取Html元素在页面中的绝对位置及问题(2)
上次在获取Html元素在页面中的绝对位置及问题(1)中说了获取页面元素绝对位置的方法,最后又说到那个方法是有问题的。为了理解这个问题,希望先看一下这两篇文章再看下面文(Web页中的HTML元素的排版布局规则、用户定制Web页中元素的排版布局策略)。 第二篇文章最后比较清楚的说明了,当我们的元素所处的viewport不是的时候,其定位是从自己的viewport的(0,0)开始计算原创 2007-05-05 19:13:00 · 736 阅读 · 0 评论 -
Web页中的HTML元素的排版布局规则
我们知道每个Web页面都是由一大堆的HTML元素组成的,我们把每对...这样的结构称为box,在Web页面的排版布局中,浏览器把这样的box作为排版的元素,并且把box分为了inline level和block level两种类型。 当然这个box内是可以容纳很多其它的HTML标签的,但是不管它的内部有多少的TAGs,box都被我们看成是一个排版元素,比如: abc 和原创 2007-05-05 19:14:00 · 612 阅读 · 0 评论 -
用户定制Web页中元素的排版布局策略
在"Web页中的HTML元素的排版布局规则"一文中,我们简述了browser是以怎样的策略来排版布局的,但很多时候默认的排版却不能完全满足我们的需要,所以我们还需要靠自己来定制Web页中HTML元素的排版布局策略。 我们可以使用这些下css属性来定制页面的显示效果,它们是:clear、float、clip、overflow(又可分别分为overflow-x和overflow-y)、d原创 2007-05-05 19:15:00 · 589 阅读 · 0 评论 -
关于HTML Object中三个Style实例的区别
我们在网页元素中定义的CSS属性,会被映射成该DHTML对象中Style对象(不是Style Tag对象)的实例。我们可以使用import-style[1]和inline-style[2]为网页元素指定CSS属性,同时也可以使用element. style. attributeName = ...的形式在Web页脚本中设置其值。但是同一个元素上的这些CSS属性值并不是都叠加后映射到原创 2007-05-05 19:16:00 · 871 阅读 · 0 评论 -
使用button元素自定义别具风格的按钮
我们都知道在Web里面定义一个按钮,最常用的方法就是使用INPUT元素的type=button。但在HTML spec 4.0里,增加了一个BUTTON元素,并且IE4.0就已经开始支持了。顾名思义,它也是用来定义一个Web页按钮的,可是它却和大不相同。 BUTTON元素和INPUT元素最大区别是,BUTTON是一个容器(container)类型元素,它可以在内部包含合法的ht原创 2007-05-05 19:17:00 · 544 阅读 · 0 评论 -
用系统滚动条实现NumericUpDown的原理
我们知道在Windows控件里有一个叫NumericUpDown的控件,使用这个控件后可以用鼠标点击或键盘上下键来微调数字,当然也可以直接输入。这是一个使用方便同时又能限制输入格式的很有用的控件,可惜在Web中却没有提供这个控件,我们只能面对几个土土的INPUT的衍生控件。 不过也有很多人制作了NumericUpDown这个控件替代品,但是由于Web上同样没有提供ScrollBar原创 2007-05-05 19:17:00 · 808 阅读 · 0 评论 -
系统滚动条实现的NUD控件Unusable版
昨天研究了一下系统滚动条,准备使用它来实现一个NumericUpDown控件,因为它可以带来最正宗的微调按钮外观,并说了一下可以使用viewport里的onScroll事件来获取系统滚动条的上下点击动作。 同时昨天还说了onScroll事件的一个问题是,在点击了滚动条的上下按钮后,onScroll事件会被连续的触发n次(n取[1,4])。我们发现这些连续事件都在一个很小的timesp原创 2007-05-05 19:18:00 · 689 阅读 · 1 评论 -
细说HTML元素的ID和Name属性的区别
可以说几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID还要有Name呢?! 而同样我们也可以得到最classical的答案:ID就像是一个人的身份证号码,而Name就像是他的名字,ID显然是唯一的,而Name是可以重复的。 上周我也遇到了ID和Name的问题,在页面里输入了一个input type="hidden",只写了一个ID=SliceI原创 2007-05-05 19:19:00 · 422 阅读 · 0 评论 -
挺好玩的uniqueID&uniqueNumber属性
在Web页中的每个HTML元素都一个ID属性,ID作为其标示,在我们的普通理解中它应该是unique的。可是HTML元素的ID属性是可写的,这就造成了我们很可能人为的使ID的重复。按么如果ID重复了怎么办呢?我们又怎么来给HTML元素弄一个唯一的标示呢? 由于IE对格式混乱(不完整的或有错嵌套关系)的HTML代码由极好的容错性,对于HTML元素的ID重复问题对它来说简直就是小菜一碟。原创 2007-05-05 19:20:00 · 854 阅读 · 0 评论 -
精通CSS(层叠样式单)语法请帮忙看看
在Web设计中,CSS(Cascading Style Sheet)其实是很熟悉的东西,不过在看一些复杂网页的CSS时,常常被一些莫名其妙写法搞得比较郁闷。于是在Google上翻啊翻,翻了一堆CSS的手册来看也没有彻底搞明白是怎么回事。下面总结一下,希望能作为一个快速参考来对付那些"怪异"的CSS。 什么是"怪异"的CSS?比如这些:style>.col, .col_wide原创 2007-05-05 19:20:00 · 431 阅读 · 0 评论 -
Web开发中的Drag&Drop完全手册
这几天做了一些drag&drop操作方面的工作,在这里把一些注意事项记录下来,算是给自己备个忘,也给需要做类似工作的人留个树阴。这里要讨论的drag&drop是指使用IE提供的内置机制,而不是使用鼠标模拟的那种"假"drag&drop,比如移动一个div或span的效果那种。 要实现和控制drag&drop操作,那么首先第一点要弄清楚的是,到底哪些元素是可以在Web上被drag的?实原创 2007-05-05 19:31:00 · 509 阅读 · 0 评论