正则表达式用于字符串处理，表单验证等场合，实用高效，但用到时总是不太把握，以致往往要上网查一番。我将一些常用的表达式收藏在这里，作备忘之用。本贴随时会更新。

匹配中文字符的正则表达式：

匹配双字节字符(包括汉字在内)：

应用：计算字符串的长度（一个双字节字符长度计2，ascii字符计1）

匹配空行的正则表达式：

匹配html标记的正则表达式：

匹配首尾空格的正则表达式：

应用：j avascript中没有像v bscript那样的trim函数，我们就可以利用这个表达式来实现，如下：

利用正则表达式分解和转换ip地址
下面是利用正则表达式匹配ip地址，并将ip地址转换成对应数值的javascript程序：

不过上面的程序如果不用正则表达式，而直接用split函数来分解可能更简单，程序如下：

匹配email地址的正则表达式：

匹配网址url的正则表达式：

利用正则表达式去除字串中重复的字符的算法程序：[*注：此程序不正确]

*注
===============================
如果var s = “abacabefggeeii”
结果就不对了，结果为：abeicfgg
正则表达式的能力有限
===============================

我原来在csdn上发贴寻求一个表达式来实现去除重复字符的方法，最终没有找到，这是我能想到的最简单的实现方法。思路是使用后向引用取出包括重复的字符，再以重复的字符建立第二个表达式，取到不重复的字符，两者串连。这个方法对于字符顺序有要求的字符串可能不适用。

得用正则表达式从url地址中提取文件名的javascript程序，如下结果为page1

利用正则表达式限制网页表单里的文本框输入内容：

用正则表达式限制只能输入中文：

用正则表达式限制只能输入全角字符：

用正则表达式限制只能输入数字：

用正则表达式限制只能输入数字和英文：

匹配非负整数（正整数 0）

匹配正整数

匹配非正整数（负整数 0）

匹配负整数

匹配整数

匹配非负浮点数（正浮点数 0）

匹配正浮点数

匹配非正浮点数（负浮点数 0）

匹配负浮点数

匹配浮点数

匹配由26个英文字母组成的字符串

匹配由26个英文字母的大写组成的字符串

匹配由26个英文字母的小写组成的字符串

匹配由数字和26个英文字母组成的字符串

匹配由数字、26个英文字母或者下划线组成的字符串

匹配email地址

匹配url

匹配html tag

visual basic & c# regular expression
1.确认有效电子邮件格式
下面的示例使用静态 regex.ismatch 方法验证一个字符串是否为有效电子邮件格式。如果字符串包含一个有效的电子邮件地址，则 isvalidemail 方法返回 true，否则返回 false，但不采取其他任何操作。您可以使用 isvalidemail，在应用程序将地址存储在数据库中或显示在 asp.net 页中之前，筛选出包含无效字符的电子邮件地址。

[visual basic]

[c#]

2.清理输入字符串
下面的代码示例使用静态 regex.replace 方法从字符串中抽出无效字符。您可以使用这里定义的 cleaninput 方法，清除掉在接受用户输入的窗体的文本字段中输入的可能有害的字符。cleaninput 在清除掉除 @、-（连字符）和 .（句点）以外的所有非字母数字字符后返回一个字符串。

[visual basic]

[c#]

3.更改日期格式
以下代码示例使用 regex.replace 方法来用 dd-mm-yy 的日期形式代替 mm/dd/yy 的日期形式。

[visual basic]

[c#]

regex 替换模式
本示例说明如何在 regex.replace 的替换模式中使用命名的反向引用。其中，替换表达式 ${ day } 插入由 (?…) 组捕获的子字符串。

有几种静态函数使您可以在使用正则表达式操作时无需创建显式正则表达式对象，而 regex.replace 函数正是其中之一。如果您不想保留编译的正则表达式，这将给您带来方便

4.提取 url 信息
以下代码示例使用 match.result 来从 url 提取协议和端口号。例如，“http://www.penner.cn:8080……将返回“http:8080”。

[visual basic]

[c#]

只有字母和数字，不小于6位，且数字字母都包含的密码的正则表达式
在c#中，可以用这个来表示：

一个将需要将路径字符串拆分为根目录和子目录两部分的算法程序，考虑路径格式有：c:\aa\bb\cc ，\\aa\bb\cc ， ftp://aa.bb/cc 上述路径将分别被拆分为：c:\和aa\bb\cc ，\\aa 和 \bb\cc ， ftp:// 和 aa.bb/cc 用javascript实现如下：

this entry was posted on 星期二, 三月 22nd, 2005 at 11:12:25 and is filed under , . you can follow any responses to this entry through the feed. you can , or from your own site.

或许你想要做的第一件事情就是解析一个某种类型的xml文档，用dom4j很容易做到。请看下面的示范代码：

import java.net.url;

import org.dom4j.document;
import org.dom4j.documentexception;
import org.dom4j.io.saxreader;

public class foo {

public document parse(url url) throws documentexception {
saxreader reader = new saxreader();
document document = reader.read(url);
return document;
}
}

1）dom(jaxp crimson解析器)
        dom是用与平台和语言无关的方式表示xml文档的官方w3c标准。dom是以层次结构组织的节点或信息片断的集合。这个层次结构允许开发人员在树中寻找特定信息。分析该结构通常需要加载整个文档和构造层次结构，然后才能做任何工作。由于它是基于信息层次的，因而dom被认为是基于树或基于对象的。dom以及广义的基于树的处理具有几个优点。首先，由于树在内存中是持久的，因此可以修改它以便应用程序能对数据和结构作出更改。它还可以在任何时候在树中上下导航，而不是像sax那样是一次性的处理。dom使用起来也要简单得多。

2）sax

        sax处理的优点非常类似于流媒体的优点。分析能够立即开始，而不是等待所有的数据被处理。而且，由于应用程序只是在读取数据时检查数据，因此不需要将数据存储在内存中。这对于大型文档来说是个巨大的优点。事实上，应用程序甚至不必解析整个文档；它可以在某个条件得到满足时停止解析。一般来说，sax还比它的替代者dom快许多。
 　　选择dom还是选择sax？ 对于需要自己编写代码来处理xml文档的开发人员来说，  选择dom还是sax解析模型是一个非常重要的设计决策。 dom采用建立树形结构的方式访问xml文档，而sax采用的事件模型。

　　dom解析器把xml文档转化为一个包含其内容的树，并可以对树进行遍历。用dom解析模型的优点是编程容易，开发人员只需要调用建树的指令，然后利用navigation apis访问所需的树节点来完成任务。可以很容易的添加和修改树中的元素。然而由于使用dom解析器的时候需要处理整个xml文档，所以对性能和内存的要求比较高，尤其是遇到很大的xml文件的时候。由于它的遍历能力，dom解析器常用于xml文档需要频繁的改变的服务中。

　　sax解析器采用了基于事件的模型，它在解析xml文档的时候可以触发一系列的事件，当发现给定的tag的时候，它可以激活一个回调方法，告诉该方法制定的标签已经找到。sax对内存的要求通常会比较低，因为它让开发人员自己来决定所要处理的tag。特别是当开发人员只需要处理文档中所包含的部分数据时，sax这种扩展能力得到了更好的体现。但用sax解析器的时候编码工作会比较困难，而且很难同时访问同一个文档中的多处不同数据。

3）jdom           

          jdom的目的是成为java特定文档模型，它简化与xml的交互并且比使用dom实现更快。由于是第一个java特定模型，jdom一直得到大力和促进。正在考虑通过“java规范请求jsr-102”将它最终用作“java标准扩展”。从2000年初就已经开始了jdom开发。

　　jdom与dom主要有两方面不同。首先，jdom仅使用具体类而不使用接口。这在某些方面简化了api，但是也限制了灵活性。第二，api大量使用了collections类，简化了那些已经熟悉这些类的java开发者的使用。

　　jdom文档声明其目的是“使用20%(或更少)的精力解决80%(或更多)java/xml问题”(根据学习曲线假定为20%)。jdom对于大多数java/xml应用程序来说当然是有用的，并且大多数开发者发现api比dom容易理解得多。jdom还包括对程序行为的相当广泛检查以防止用户做任何在xml中无意义的事。然而，它仍需要您充分理解xml以便做一些超出基本的工作(或者甚至理解某些情况下的错误)。这也许是比学习dom或jdom接口都更有意义的工作。

　　jdom自身不包含解析器。它通常使用sax2解析器来解析和验证输入xml文档(尽管它还可以将以前构造的dom表示作为输入)。它包含一些转换器以将jdom表示输出成sax2事件流、dom模型或xml文本文档。jdom是在apache许可证变体下发布的开放。

4）dom4j  
            
        虽然dom4j代表了完全独立的开发结果，但最初，它是jdom的一种智能分支。它合并了许多超出基本xml文档表示的功能，包括集成的xpath支持、xml schema支持以及用于大文档或流化文档的基于事件的处理。它还提供了构建文档表示的选项，它通过dom4j api和标准dom接口具有并行访问功能。从2000下半年开始，它就一直处于开发之中。

　　为支持所有这些功能，dom4j使用接口和抽象基本类方法。dom4j大量使用了api中的collections类，但是在许多情况下，它还提供一些替代方法以允许更好的性能或更直接的编码方法。直接好处是，虽然dom4j付出了更复杂的api的代价，但是它提供了比jdom大得多的灵活性。

　　在添加灵活性、xpath集成和对大文档处理的目标时，dom4j的目标与jdom是一样的：针对java开发者的易用性和直观操作。它还致力于成为比jdom更完整的凯发天生赢家一触即发官网的解决方案，实现在本质上处理所有java/xml问题的目标。在完成该目标时，它比jdom更少强调防止不正确的应用程序行为。

　　dom4j是一个非常非常优秀的java xml api，具有性能优异、功能强大和极端易用使用的特点，同时它也是一个开放源代码的。如今你可以看到越来越多的java都在使用dom4j来读写xml，特别值得一提的是连sun的jaxm也在用dom4j。

2.. 比较

1）dom4j性能最好，连sun的jaxm也在用dom4j。目前许多开源项目中大量采用dom4j，例如大名鼎鼎的hibernate也用dom4j来读取xml配置文件。如果不考虑可移植性，那就采用dom4j.

2）jdom和dom在性能测试时表现不佳，在测试10m文档时内存溢出。在小文档情况下还值得考虑使用dom和jdom。虽然jdom的开发者已经说明他们期望在正式发行版前专注性能问题，但是从性能观点来看，它确实没有值得推荐之处。另外，dom仍是一个非常好的选择。dom实现广泛应用于多种编程语言。它还是许多其它与xml相关的标准的基础，因为它正式获得w3c推荐(与基于非标准的java模型相对)，所以在某些类型的项目中可能也需要它(如在javascript中使用dom)。

3）sax表现较好，这要依赖于它特定的解析方式－事件驱动。一个sax检测即将到来的xml流，但并没有载入到内存(当然当xml流被读入时，会有部分文档暂时隐藏在内存中)。

3. 四种xml操作方式的基本使用方法

xml文件：

＜?xml version="1.0" encoding="gb2312"?＞
＜result＞
    ＜value＞
　　      ＜no＞a1234＜/no＞
　　     ＜addr＞四川省xx县xx镇xx路x段xx号＜/addr＞
    ＜/value＞
    ＜value＞
　　      ＜no＞b1234＜/no＞
　     　＜addr＞四川省xx市xx乡xx村xx组＜/addr＞
    ＜/value＞
＜/result＞

1）dom

import java.io.*;
import java.util.*;
import org.w3c.dom.*;
import javax.xml.parsers.*;

public class myxmlreader{
　public static void main(string arge[]){

　　long lasting =system.currenttimemillis();
　　try{ 
　　　file f=new file("data_10k.xml");
　　　documentbuilderfactory factory=documentbuilderfactory.newinstance();
　　　documentbuilder builder=factory.newdocumentbuilder();
　　　document doc = builder.parse(f);
　　　nodelist nl = doc.getelementsbytagname("value");
　　　for (int i=0;i＜nl.getlength();i ){
　　　　system.out.print("车牌号码:" doc.getelementsbytagname("no").item(i).getfirstchild().getnodevalue());
　　　　system.out.println("车主地址:" doc.getelementsbytagname("addr").item(i).getfirstchild().getnodevalue());
　 　}
　　}catch(exception e){
　　　e.printstacktrace();
}

2）sax

import org.xml.sax.*;
import org.xml.sax.helpers.*;
import javax.xml.parsers.*;

public class myxmlreader extends defaulthandler {

　java.util.stack tags = new java.util.stack();
　public myxmlreader() {
　　super();
   }

　public static void main(string args[]) {
　　long lasting = system.currenttimemillis();
　　try {
　　　saxparserfactory sf = saxparserfactory.newinstance();
　　　saxparser sp = sf.newsaxparser();
　　　myxmlreader reader = new myxmlreader();
　　　sp.parse(new inputsource("data_10k.xml"), reader);
　　} catch (exception e) {
　　　e.printstacktrace();
　　}

　　system.out.println("运行时间：" (system.currenttimemillis() - lasting) "毫秒");}
　　public void characters(char ch[], int start, int length) throws saxexception {
　　string tag = (string) tags.peek();
　　if (tag.equals("no")) { 
　　　system.out.print("车牌号码：" new string(ch, start, length));
    }
    if (tag.equals("addr")) {
　　system.out.println("地址:" new string(ch, start, length));
    }
   }

　　public void startelement(string uri,string localname,string qname,attributes attrs) {
　　tags.push(qname);}
} 

3） jdom

import java.io.*;
import java.util.*;
import org.jdom.*;
import org.jdom.input.*;

public class myxmlreader {

　public static void main(string arge[]) {
　　long lasting = system.currenttimemillis();
　　try {
　　　saxbuilder builder = new saxbuilder(); 
　　　document doc = builder.build(new file("data_10k.xml")); 
　　　element foo = doc.getrootelement(); 
　　　list allchildren = foo.getchildren(); 
　　　for(int i=0;i＜allchildren.size();i ) { 
　　　　system.out.print("车牌号码:" ((element)allchildren.get(i)).getchild("no").gettext());
　　　　system.out.println("车主地址:" ((element)allchildren.get(i)).getchild("addr").gettext());
　　　}
　　} catch (exception e) {
　　　e.printstacktrace();
}

}

4）dom4j

import java.io.*;
import java.util.*;
import org.dom4j.*;
import org.dom4j.io.*;

public class myxmlreader {

　public static void main(string arge[]) {
　　long lasting = system.currenttimemillis();
　　try {
　　　file f = new file("data_10k.xml");
　　　saxreader reader = new saxreader();
　　　document doc = reader.read(f);
　　　element root = doc.getrootelement();
　　　element foo;
　　　for (iterator i = root.elementiterator("value"); i.hasnext();) {
　　　　foo = (element) i.next();
　　　　system.out.print("车牌号码:" foo.elementtext("no"));
　　　　system.out.println("车主地址:" foo.elementtext("addr"));
　　　}
　　} catch (exception e) {
　　　e.printstacktrace();
    }
}

转自：

1.文档对象模型（dom）
dom是html和xml文档的编程基础，它定义了处理执行文档的途径。

我的xml文件login.xml如下.


    
        
        
        
        
        
    
    
        
        
    
    
        

to read and update - create and manipulate - an xml document, you will need an xml parser.

microsoft's xml parser

microsoft's xml parser is a com component that comes with internet explorer 5 and higher. once you have installed internet explorer, the parser is available to scripts.

microsoft's xml parser supports all the necessary functions to traverse the node tree, access the nodes and their attribute values, insert and delete nodes, and convert the node tree back to xml.

the following table lists the most commonly used node types supported by microsoft's xml parser:

msxml parser 2.5 is the xml parser that is shipped with windows 2000 and ie 5.5.

msxml parser 3.0 is the xml parser that is shipped with ie 6.0 and windows xp.

the msxml 3.0 parser features:

• javascript, vbscript, perl, vb, java, c , etc. support
• complete xml support
• full dom and namespace support
• dtd and validation
• complete xslt and xpath support
• sax2 support
• server-safe http

to create an instance of microsoft's xml parser with javascript, use the following code:

var xmldoc=new activexobject("microsoft.xmldom")

to create an instance of microsoft's xml parser with vbscript, use the following code:

set xmldoc=createobject("microsoft.xmldom")

to create an instance of microsoft's xml parser in an asp page (using vbscript), use the following code:

set xmldoc=server.createobject("microsoft.xmldom")

the following code loads an existing xml document ("note.xml") into microsoft's xml parser:

the first line of the script above creates an instance of the microsoft xml parser. the third line tells the parser to load an xml document called "note.xml". the second line turns off asynchronized loading, to make sure that the parser will not continue execution of the script before the document is fully loaded.

xml parser in mozilla browsers

plain xml documents are displayed in a tree-like structure in mozilla (just like ie).

mozilla also supports parsing of xml data using javascript. the parsed data can be displayed as html.

to create an instance of the xml parser with javascript in mozilla browsers, use the following code:

var xmldoc=document.implementation.createdocument("ns","root",null)

the first parameter, ns, defines the namespace used for the xml document. the second parameter, root, is the xml root element in the xml file. the third parameter, null, is always null because it is not implemented yet.

the following code loads an existing xml document ("note.xml") into mozillas' xml parser:

the first line of the script above creates an instance of the xml parser. the second line tells the parser to load an xml document called "note.xml".

loading an xml file - a cross browser example

the following example is a cross browser example that loads an existing xml document ("note.xml") into the xml parser:

to: 

from: 

message: 

try it yourself

loading xml text into the parser

internet explorer supports two ways of loading xml into a document object: the load() method and the loadxml() method. the load() method loads an xml file and the loadxml() method loads a text string that contains xml code.

the following code loads a text string into microsoft's xml parser:

if you have internet explorer, you can try it yourself.

摘要:

      map buffalocontext.getcontext.getsession()
      map buffalocontext.getcontext.getapplication()
      map buffalocontext.getcontext.getcookie()

近日学习了一下ajax，照做了几个例子，感觉比较新奇。

第一个就是自动完成的功能即autocomplete,具体的例子可以在这里看：

在search框内输入一个产品型号，就可以看见效果了。

这里用到了一个开源的代码：，有兴趣的可以看一下。

以下为代码片断：

index.htm

不知道为什么不能用keywords做文本框的名字，我试了很久，后来还是用keyword,搞得还要修改原代码。

forcsv.php

  $keyword = $_get['q'];
  $count = 0;
  $handle = fopen("products.csv", "r");
  while (($data = fgetcsv($handle, 1000)) !== false) {
    if (preg_match("/$keyword/i", $data[0])) {
      if ($count > 10) { break; }
?>
     

原来的例子中的csv文件是根据\t来分隔的，我们也可以用空格或其它的来分隔，这取决于你的数据结构。

当然你也可以不读文件，改从数据库里读资料，就不再废话了。

效果图如下：

trackback: http://tb.blog.csdn.net/trackback.aspx?postid=635858

本期文章介绍了一位客串的专栏作家，同时也是我的朋友和同事 dethe elza。dethe 在利用 xml 进行 web 应用程序开发方面经验丰富，在此，我要感谢他对我在介绍使用 dom 和 ecmascript 进行 xml 编程这一方面的帮助。请密切关注本专栏，以了解 dethe 的更多专栏文章。 —— david mertz

dom 是处理 xml 和 html 的标准 api 之一。由于它占用内存大、速度慢，并且冗长，所以经常受到人们的指责。尽管如此，对于很多应用程序来说，它仍然是最佳选择，而且比 xml 的另一个主要 api —— sax 无疑要简单得多。dom 正逐渐出现在一些工具中，比如 web 浏览器、svg 浏览器、openoffice，等等。

dom 很好，因为它是一种标准，并且被广泛地实现，同时也内置到其他标准中。作为标准，它对数据的处理与编程语言无关（这可能是优点，也可能是缺点，但至少使我们处理数据的方式变得一致）。dom 现在不仅内置于 web 浏览器，而且也成为许多基于 xml 的规范的一部分。既然它已经成为您的工具的一部分，并且或许您偶尔还会使用它，我想现在应该充分利用它给我们带来的功能了。

在使用 dom 一段时间后，您会看到形成了一些模式 —— 您想要反复做的事情。快捷方式可以帮助您处理冗长的 dom，并创建自解释的、优雅的代码。这里收集了一些我经常使用的技巧和诀窍，还有一些 javascript 示例。

第一个诀窍就是“没有诀窍”。dom 有两种方法将孩子节点添加到容器节点（常常是一个 element，也可能是一个 document 或 documentfragment）：appendchild(node) 和 insertbefore(node, referencenode)。看起来似乎缺少了什么。假如我想在一个参考节点后面插入或者由前新增（prepend）一个子节点（使新节点位于列表中的第一位），我该怎么做呢？很多年以来，我的解决方法是编写下列函数：

												
														function insertafter(parent, node, referencenode) {
    if(referencenode.nextsibling) {
        parent.insertbefore(node, referencenode.nextsibling);
    } else {
        parent.appendchild(node);
    }
}
function prependchild(parent, node) {
    if (parent.firstchild) {
        parent.insertbefore(node, parent.firstchild);
    } else {
        parent.appendchild(node);
    }
}

												
										

实际上，像清单 1 一样，insertbefore() 函数已经被定义为，在参考节点为空时返回到 appendchild()。因此，您可以不使用上面的方法，而使用 中的方法，或者跳过它们仅使用内置函数：

												
														function insertafter(parent, node, referencenode) {
    parent.insertbefore(node, referencenode.nextsibling);
}
function prependchild(parent, node) {
    parent.insertbefore(node, parent.firstchild);
}

												
										

如果您刚刚接触 dom 编程，有必要指出的是，虽然您可以使多个指针指向一个节点，但该节点只能存在于 dom 树中的一个位置。因此，如果您想将它插入到树中，没必要先将它从树中移除，因为它会自动被移除。当重新将节点排序时，这种机制很方便，仅需将节点插入到新位置即可。

根据这种机制，若想交换两个相邻节点（称为 node1 和 node2）的位置，可以使用下列方案之一：

												
														
																
																		node1.parentnode.insertbefore(node2, node1);
																
														
														node1.parentnode.insertbefore(node2, node1);
												
										

或

												
														
																
																		node1.parentnode.insertbefore(node1.nextsibling, node1);
																
														
														node1.parentnode.insertbefore(node1.nextsibling, node1);
												
										

web 页面中大量应用了 dom。若访问 bookmarklets 站点（参阅 ），您会发现很多有创意的简短脚本，它们可以重新编排页面，提取链接，隐藏图片或 flash 广告，等等。

但是，因为 internet explorer 没有定义 node 接口常量（可以用于识别节点类型），所以您必须确保在遗漏接口常量时，首先为 web 在 dom 脚本中定义接口常量。

												
														if (!window['node']) {
    window.node = new object();
    node.element_node = 1;
    node.attribute_node = 2;
    node.text_node = 3;
    node.cdata_section_node = 4;
    node.entity_reference_node = 5;
    node.entity_node = 6;
    node.processing_instruction_node = 7;
    node.comment_node = 8;
    node.document_node = 9;
    node.document_type_node = 10;
    node.document_fragment_node = 11;
    node.notation_node = 12;
}

												
										

展示如何提取包含在节点中的所有文本节点：

												
														function innertext(node) {
    // is this a text or cdata node?
    if (node.nodetype == 3 || node.nodetype == 4) {
        return node.data;
    }
    var i;
    var returnvalue = [];
    for (i = 0; i < node.childnodes.length; i  ) {
        returnvalue.push(innertext(node.childnodes[i]));
    }
    return returnvalue.join('');
}

												
										

人们常常抱怨 dom 太过冗长，并且简单的功能也需要编写大量代码。例如，如果您想创建一个包含文本并响应点击按钮的

元素，代码可能类似于：

function handle_button() { var parent = document.getelementbyid('mycontainer'); var div = document.createelement('div'); div.classname = 'mydivcssclass'; div.id = 'mydivid'; div.style.position = 'absolute'; div.style.left = '300px'; div.style.top = '200px'; var text = "this is the first text of the rest of this code"; var textnode = document.createtextnode(text); div.appendchild(textnode); parent.appendchild(div); }

若频繁按照这种方式创建节点，键入所有这些代码会使您很快疲惫不堪。必须有更好的凯发天生赢家一触即发官网的解决方案 —— 确实有这样的凯发天生赢家一触即发官网的解决方案！下面这个实用工具可以帮助您创建元素、设置元素属性和风格，并添加文本子节点。除了 name 参数，其他参数都是可选的。

function elem(name, attrs, style, text) { var e = document.createelement(name); if (attrs) { for (key in attrs) { if (key == 'class') { e.classname = attrs[key]; } else if (key == 'id') { e.id = attrs[key]; } else { e.setattribute(key, attrs[key]); } } } if (style) { for (key in style) { e.style[key] = style[key]; } } if (text) { e.appendchild(document.createtextnode(text)); } return e; }

使用该快捷方式，您能够以更加简洁的方法创建 中的

元素。注意，attrs 和 style 参数是使用 javascript 文本对象而给出的。

function handle_button() { var parent = document.getelementbyid('mycontainer'); parent.appendchild(elem('div', {class: 'mydivcssclass', id: 'mydivid'} {position: 'absolute', left: '300px', top: '200px'}, 'this is the first text of the rest of this code')); }

在您想要快速创建大量复杂的 dhtml 对象时，这种实用工具可以节省您大量的时间。模式在这里就是指，如果您有一种需要频繁创建的特定的 dom 结构，则使用实用工具来创建它们。这不但减少了您编写的代码量，而且也减少了重复的剪切、粘贴代码（错误的罪魁祸首），并且在阅读代码时思路更加清晰。

dom 通常很难告诉您，按照文档的顺序，下一个节点是什么。下面有一些实用工具，可以帮助您在节点间前后移动：

// return next node in document order function nextnode(node) { if (!node) return null; if (node.firstchild){ return node.firstchild; } else { return nextwide(node); } } // helper function for nextnode() function nextwide(node) { if (!node) return null; if (node.nextsibling) { return node.nextsibling; } else { return nextwide(node.parentnode); } } // return previous node in document order function prevnode(node) { if (!node) return null; if (node.previoussibling) { return previousdeep(node.previoussibling); } return node.parentnode; } // helper function for prevnode() function previousdeep(node) { if (!node) return null; while (node.childnodes.length) { node = node.lastchild; } return node; }

有时候，您可能想要遍历 dom，在每个节点调用函数或从每个节点返回一个值。实际上，由于这些想法非常具有普遍性，所以 dom level 2 已经包含了一个称为 dom traversal and range 的扩展（为迭代 dom 所有节点定义了对象和 api），它用来为 dom 中的所有节点应用函数和在 dom 中选择一个范围。因为这些函数没有在 internet explorer 中定义（至少目前是这样），所以您可以使用 nextnode() 来做一些类似的事情。

在这里，我们的想法是创建一些简单、普通的工具，然后以不同的方式组装它们来达到预期的效果。如果您很熟悉函数式编程，这看起来会很亲切。beyond js 库（参阅 ）将此理念发扬光大。

// return an array of all nodes, starting at startnode and // continuing through the rest of the dom tree function listnodes(startnode) { var list = new array(); var node = startnode; while(node) { list.push(node); node = nextnode(node); } return list; } // the same as listnodes(), but works backwards from startnode. // note that this is not the same as running listnodes() and // reversing the list. function listnodesreversed(startnode) { var list = new array(); var node = startnode; while(node) { list.push(node); node = prevnode(node); } return list; } // apply func to each node in nodelist, return new list of results function map(list, func) { var result_list = new array(); for (var i = 0; i < list.length; i ) { result_list.push(func(list[i])); } return result_list; } // apply test to each node, return a new list of nodes for which // test(node) returns true function filter(list, test) { var result_list = new array(); for (var i = 0; i < list.length; i ) { if (test(list[i])) result_list.push(list[i]); } return result_list; }

清单 9 包含了 4 个基本工具。listnodes() 和 listnodesreversed() 函数可以扩展到一个可选的长度，这与 array 的 slice() 方法效果类似，我把这个作为留给您的练习。另一个需要注意的是，map() 和 filter() 函数是完全通用的，用于处理任何 列表（不只是节点列表）。现在，我向您展示它们的几种组合方式。

// a list of all the element names in document order function iselement(node) { return node.nodetype == node.element_node; } function nodename(node) { return node.nodename; } var elementnames = map(filter(listnodes(document),iselement), nodename); // all the text from the document (ignores cdata) function istext(node) { return node.nodetype == node.text_node; } function nodevalue(node) { return node.nodevalue; } var alltext = map(filter(listnodes(document), istext), nodevalue);

您可以使用这些实用工具来提取 id、修改样式、找到某种节点并移除，等等。一旦 dom traversal and range api 被广泛实现，您无需首先构建列表，就可以用它们修改 dom 树。它们不但功能强大，并且工作方式也与我在上面所强调的方式类似。

注意，核心 dom api 并不能使您将 xml 数据解析到 dom，或者将 dom 序列化为 xml。这些功能都定义在 dom level 3 的扩展部分“load and save”，但它们还没有被完全实现，因此现在不要考虑这些。每个平台（浏览器或其他专业 dom 应用程序）有自己在 dom 和 xml 间转换的方法，但跨平台转换不在本文讨论范围之内。

dom 并不是十分安全的工具 —— 特别是使用 dom api 创建不能作为 xml 序列化的树时。绝对不要在同一个程序中混合使用 dom1 非名称空间 api 和 dom2 名称空间感知的 api（例如，createelement 和 createelementns）。如果您使用名称空间，请尽量在根元素位置声明所有名称空间，并且不要覆盖名称空间前缀，否则情况会非常混乱。一般来说，只要按照惯例，就不会触发使您陷入麻烦的临界情况。

如果您一直使用 internet explorer 的 innertext 和 innerhtml 进行解析，那么您可以试试使用 elem() 函数。通过构建类似的一些实用工具，您会得到更多便利，并且继承了跨平台代码的优越性。将这两种方法混合使用是非常糟糕的。

某些 unicode 字符并没有包含在 xml 中。dom 的实现使您可以添加它们，但后果是无法序列化。这些字符包括大多数的控制字符和 unicode 代理对（surrogate pair）中的单个字符。只有您试图在文档中包含二进制数据时才会遇到这种情况，但这是另一种转向（gotcha）情况。

我已经介绍了 dom 能做的很多事情，但是 dom（和 javascript）可以做的事情远不止这些。仔细研究、揣摩这些例子，看看是如何使用它们来解决可能需要客户端脚本、模板或专用 api 的问题。

dom 有自己的局限性和缺点，但同时也拥有众多优点：它内置于很多应用程序中；无论使用 java 技术、python 或 javascript，它都以相同方式工作；它非常便于使用 sax；使用上述的模板，它使用起来既简洁又强大。越来越多的应用程序开始支持 dom，这包括基于 mozilla 的应用程序、openoffice 和 blast radius 的 xmetal。越来越多的规范需要 dom，并对它加以扩展（例如，svg），因此 dom 时时刻刻就在您的身边。使用这种被广泛部署的工具，绝对是您的明智之举。

• 您可以参阅本文在 developerworks 全球站点上的 。
  
  
• 下载 ，它包含了上面的脚本和一个用于测试这些脚本的简单 。
  
  
• 直接访问 dom 发源地 —— w3c 的 ，其中包含到所有与文档对象模型相关的标准的链接。
  
  
• 查看 jesse ruderman 的 。虽然 ruderman 没有创造术语“bookmarkets”，但他收集了很多一流的、简短的、书签似的 javascript，使用它们开发 dom 的巨大潜力，使您的浏览器可以为您带来更多帮助。
  
  
• 访问 sjoerd visscher 的 库，它提供了远远超过我在这里提及的用于函数式编程的工具。如果您可以将事物抽象为函数，那么 javascript 将会成为您得心应手的工具。
  
  
• dom api 的标准参考在 w3c。这里是 的网址。
  
  
• 了解 ajax 为什么已经引起了这么大的反响。它使用了异步调用来使服务器实时升级 web 应用程序。您可以使用上述的许多技术，并阅读 。
  
  
• 了解一下 xml 编辑器和工具的 系列，它们都支持 dom api。它们由作者所在的公司 blast radius 开发。
  
  
• 在 developerworks 的 了解更多 xml 相关的书籍，其中包括 david mertz 的 一书。
  
  
• 了解如何才能成为 。
  

xzc 2006-08-22 15:21

]]>http://www.blogjava.net/xzclog/archive/2006/08/22/65079.htmlxzcxzctue, 22 aug 2006 07:07:00 gmthttp://www.blogjava.net/xzclog/archive/2006/08/22/65079.htmlhttp://www.blogjava.net/xzclog/comments/65079.htmlhttp://www.blogjava.net/xzclog/archive/2006/08/22/65079.html#feedback4http://www.blogjava.net/xzclog/comments/commentrss/65079.htmlhttp://www.blogjava.net/xzclog/services/trackbacks/65079.html（1） 
function setprintsettings() { 
　// -- advanced features 
　factory.printing.setmarginmeasure(2) // measure margins in inches 
　factory.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 = "this is meadco" 
　factory.printing.footer = "advanced printing by scriptx" 
　factory.printing.portrait = false 
　factory.printing.leftmargin = 1.0 
　factory.printing.topmargin = 1.0 
　factory.printing.rightmargin = 1.0 
　factory.printing.bottommargin = 1.0 
} 
 

（2） 
 
　　function printsetup(){ 
　　// 打印页面设置 
　　wb.execwb(8,1); 
　　} 
　　function printpreview(){ 
　　// 打印页面预览 
　　　　 
　　wb.execwb(7,1); 
　　　　　 
　　　　 
　　} 

　　function printit() 
　　{ 
　　if (confirm(''确定打印吗？'')) { 
　　wb.execwb(6,6) 
　　} 
　　} 
　　 
 
 

height=0 id=wb name=wb width=0> 

onclick="javascript:printit()"> 

onclick="javascript:printsetup();"> 

onclick="javascript:printpreview();"> 

onclick="javascript:window.close();"> 

------------------------------------------------ 
关于这个组件还有其他的用法，列举如下： 
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) 关闭窗体无提示 

2、分页打印 
 
 
 
 
 
<%while not rs.eof%> 

<%=rs(0)%>

 
<%rs.movenext%> 
<%wend%> 
 
 

3、asp页面打印时如何去掉页面底部的路径和顶端的页码编号 
（1）ie的文件-〉页面设置-〉讲里面的页眉和页脚里面的东西都去掉，打印就不出来了。 
（2） 
 
 
 
 
 
dim hkey_root,hkey_path,hkey_key 
hkey_root="hkey_current_user" 
hkey_path="\software\microsoft\internet explorer\pagesetup" 
''//设置网页打印的页眉页脚为空 
function pagesetup_null() 
　　on error resume next 
　　set regwsh = createobject("wscript.shell") 
　　hkey_key="\header"　　 
　　regwsh.regwrite hkey_root hkey_path hkey_key,"" 
　　hkey_key="\footer" 
　　regwsh.regwrite hkey_root hkey_path hkey_key,"" 
end function 
''//设置网页打印的页眉页脚为默认值 
function pagesetup_default() 
　　on error resume next 
　　set regwsh = createobject("wscript.shell") 
　　hkey_key="\header"　　 
　　regwsh.regwrite hkey_root hkey_path hkey_key,"&w&b页码，&p/&p" 
　　hkey_key="\footer" 
　　regwsh.regwrite hkey_root hkey_path hkey_key,"&u&b&d" 
end function 
 
 

 

 

 

 

 

 

 
 
 

 
 
 
4、浮动帧打印 
 
function button1_onclick() { 
　　var odoc=window.iframe1.document; 
　　var r=odoc.body.createtextrange(); 
　　var stxt=r.htmltext; 
　　alert(stxt) 
　　var pwin=window.open("","print"); 
　　pwin.document.write(stxt); 
　　pwin.print(); 
} 
 
4、用filesystem组件实现web应用中的本地特定打印 
 
function print_onclick //打印函数 
dim label 
label=document.printinfo.label.value //获得html页面的数据 
set objfs=createobject("scripting.filesystemobject") //创建filesystem组件对象的实例 
set objprinter=objfs.createtextfile ("lpt1:",true) //建立与打印机的连接 
objprinter.writeline("__________________________________") //输出打印的内容 
objprinter.writeline("| |") 
objprinter.writeline("| 您打印的数据是："&label& " |”) 
objprinter.writeline("| |") 
objprinter.writeline("|_________________________________|") 
objprinter.close //断开与打印机的连接 
set objprinter=nothing 
set objfs=nothing // 关闭filesystem组件对象 
end function 
 
服务器端脚本： 
<%……… 
set conn=server.createobject ("adodb.connection") 
conn.open "dsn=name;uid=xxxx;pwd=xxxx;" 
set rs=server.createobject("adodb.recordset") 
rs.open(“select ……”),conn,1,1 
……….%> //与数据库进行交互 
html页面编码： 
 
……… 
 
>" id=print name=print > //调用打印函数 
> //保存服务器端传来的数据 
……… 

xzc 2006-08-22 15:07

]]>http://www.blogjava.net/xzclog/archive/2006/06/22/54451.htmlxzcxzcthu, 22 jun 2006 04:28:00 gmthttp://www.blogjava.net/xzclog/archive/2006/06/22/54451.htmlhttp://www.blogjava.net/xzclog/comments/54451.htmlhttp://www.blogjava.net/xzclog/archive/2006/06/22/54451.html#feedback0http://www.blogjava.net/xzclog/comments/commentrss/54451.htmlhttp://www.blogjava.net/xzclog/services/trackbacks/54451.html<script language="javascript">

script>

、文档对象模型（dom）
　　文档对象模型（dom）是表示文档（比如html和xml）和访问、操作构成文档的各种元素的应用程序接口（api）。一般的，支持javascript的所有浏览器都支持dom。本文所涉及的dom，是指w3c定义的标准的文档对象模型，它以树形结构表示html和xml文档，定义了遍历这个树和检查、修改树的节点的方法和属性。

7.4.1、dom眼中的html文档：树
　　在dom眼中，html跟xml一样是一种树形结构的文档，是根（root）节点，、http://www.blogjava.net/xzclog/archive/2006/06/22/54448.htmlxzcxzcthu, 22 jun 2006 04:23:00 gmthttp://www.blogjava.net/xzclog/archive/2006/06/22/54448.htmlhttp://www.blogjava.net/xzclog/comments/54448.htmlhttp://www.blogjava.net/xzclog/archive/2006/06/22/54448.html#feedback0http://www.blogjava.net/xzclog/comments/commentrss/54448.htmlhttp://www.blogjava.net/xzclog/services/trackbacks/54448.htmlhttp://www.blogjava.net/eamoi/archive/2005/10/31/17489.aspx

xzc 2006-06-22 12:23

]]>http://www.blogjava.net/xzclog/archive/2006/06/21/54365.htmlxzcxzcwed, 21 jun 2006 13:55:00 gmthttp://www.blogjava.net/xzclog/archive/2006/06/21/54365.htmlhttp://www.blogjava.net/xzclog/comments/54365.htmlhttp://www.blogjava.net/xzclog/archive/2006/06/21/54365.html#feedback0http://www.blogjava.net/xzclog/comments/commentrss/54365.htmlhttp://www.blogjava.net/xzclog/services/trackbacks/54365.html1向表中追加行
2通过javascript设置元素的样式
3设置元素的class属性
4创建输入元素
5向输入元素增加事件处理程序
6创建单选按钮

1. 1.
5. var cell = documentcreateelement("td").appendchild(document.createtextnode("foo"));
6. var row = document.createelement("tr").appendchild(cell);
7. document.getelementbyid("mytableboyd").appendchild(row);
10. 2.
11. var spanelement = document.getelementbyid("myspan");
12. //spanelement.setattribute("style","font-weight:bold;color:red");
13. spanelement.style.csstext="font-weight:bold;color:red";
15. 3.
16. element.setattribute("class","stylename");//非ie
17. element.setattribute("classname","stylename");//ie
19. 4.
20. var button = document.createelement("input");
21. button.setattribute("type","button");
22. document.getelementbyid("form").appendchild(button);
24. 5.
25. var element = document.getelementbyid("ee");
26. element.onclick=function(){todo();};
28. 6.
29. var ration = document.createelement(");//ie
31. vat radion = document.createelement("input");
32. radion .setattribute("type","radio");
33. radion.setattribute("name","radionsss");
34. radion.setattribute("value","checked");

xzc 2006-06-21 21:55

]]>