📄 掌握 ajax，第 5 部分 操纵 dom.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0055)http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro5/ -->
<HTML lang=zh-CN xml:lang="zh-CN"
xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>掌握 Ajax，第 5 部分: 操纵 DOM</TITLE>
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<META http-equiv=PICS-Label
content='(PICS-1.1 "http://www.icra.org/ratingsv02.html" l gen true r (cz 1 lz 1 nz 1 oz 1 vz 1) "http://www.rsac.org/ratingsv01.html" l gen true r (n 0 s 0 v 0 l 0) "http://www.classify.org/safesurf/" l gen true r (SS~~000 1))'><LINK
href="http://purl.org/DC/elements/1.0/" rel=schema.DC><LINK
href="http://www.ibm.com/favicon.ico" rel="SHORTCUT ICON">
<META content=dw@cn.ibm.com name=Owner>
<META scheme=rfc1766 content=zh-CN name=DC.Language>
<META content=cn name=IBM.Country>
<META content=Public name=Security>
<META
content="上一期中 Brett 介绍了文档对象模型（DOM），它的元素在幕后定义了 Web 页面。这一期文章中他将进一步探讨 DOM。了解如何创建、删除和修改 DOM 树的各个部分，了解如何实现网页的即时更新！"
name=Abstract>
<META
content="上一期中 Brett 介绍了文档对象模型（DOM），它的元素在幕后定义了 Web 页面。这一期文章中他将进一步探讨 DOM。了解如何创建、删除和修改 DOM 树的各个部分，了解如何实现网页的即时更新！"
name=Description>
<META
content="Ajax, Asynchronous Java and XML, JavaScript, DOM, node construct, nodeType, nodeValue, nodeName, properties, methods, Internet Explorer, IE 7, XMLHttpRequest, XMLHttp, XML, XHTML, DHTML, Dynamic HTML, Web 2.0, span, div, Brett McLaughlin, 异步 Javascript 和 XML, 节点构造, 属性, 方法, tttwaca, tttxca, tttjca, tttwsca"
name=Keywords>
<META scheme=iso8601 content=2006-04-27 name=DC.Date>
<META content="Based on v14 Template Generator, Template 14.0" name=Source>
<META content="Copyright (c) 2006 by IBM Corporation" name=DC.Rights>
<META content=index,follow name=Robots>
<META scheme=W3CDTF content=2006-04-27 name=IBM.Effective>
<META content=17012007zoucl@cn.ibm.com name="Last update"><LINK
media=screen,print href="掌握 Ajax，第 5 部分 操纵 DOM.files/table.css" type=text/css
rel=stylesheet>
<SCRIPT language=JavaScript src="掌握 Ajax，第 5 部分 操纵 DOM.files/dwcss14.js"
type=text/javascript></SCRIPT>
<NOSCRIPT><LINK href="掌握 Ajax，第 5 部分 操纵 DOM.files/r1ss.css" type=text/css
rel=stylesheet></NOSCRIPT><LINK href="掌握 Ajax，第 5 部分 操纵 DOM.files/main.css"
type=text/css rel=stylesheet><LINK media=all
href="掌握 Ajax，第 5 部分 操纵 DOM.files/screen.css" type=text/css rel=stylesheet><LINK
media=print href="掌握 Ajax，第 5 部分 操纵 DOM.files/print.css" type=text/css
rel=stylesheet>
<SCRIPT language=JavaScript src="掌握 Ajax，第 5 部分 操纵 DOM.files/detection.js"
type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="掌握 Ajax，第 5 部分 操纵 DOM.files/dropdown.js"
type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="掌握 Ajax，第 5 部分 操纵 DOM.files/grabtitle.js"
type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="掌握 Ajax，第 5 部分 操纵 DOM.files/emailfriend2.js"
type=text/javascript></SCRIPT>
<!--START RESERVED FOR FUTURE USE INCLUDE FILES-->
<SCRIPT language=javascript src="掌握 Ajax，第 5 部分 操纵 DOM.files/ajax1.js"
type=text/javascript></SCRIPT>
<SCRIPT language=javascript src="掌握 Ajax，第 5 部分 操纵 DOM.files/searchcount.js"
type=text/javascript></SCRIPT>
<!--END RESERVED FOR FUTURE USE INCLUDE FILES-->
<SCRIPT language=JavaScript type=text/javascript>var emailAbstract = "上一期中 Brett 介绍了文档对象模型（DOM），它的元素在幕后定义了 Web 页面。这一期文章中他将进一步探讨 DOM。了解如何创建、删除和修改 DOM 树的各个部分，了解如何实现网页的即时更新！"; </SCRIPT>
<META content="MSHTML 6.00.2900.3059" name=GENERATOR></HEAD>
<BODY><!--MASTHEAD_BEGIN-->
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top>
<TD class=bbg width=110><A href="http://www.ibm.com/cn/"><IMG height=52
alt=IBM® src="掌握 Ajax，第 5 部分 操纵 DOM.files/ibm-logo.gif" width=110
border=0></A></TD>
<TD class=bbg><IMG height=1 alt="" src="掌握 Ajax，第 5 部分 操纵 DOM.files/c.gif"
width=1 border=0></TD>
<TD class=mbbg align=right width=650>
<TABLE cellSpacing=0 cellPadding=0 align=right border=0>
<TBODY>
<TR class=cty-tou>
<TD class=upper-masthead-corner width=17 rowSpan=2><A
href="http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro5/#main"><IMG
height=1 alt=跳转到主要内容 src="掌握 Ajax，第 5 部分 操纵 DOM.files/c.gif" width=1
border=0></A></TD>
<TD align=left>
<TABLE cellSpacing=0 cellPadding=0 align=left border=0>
<TBODY>
<TR>
<TD><SPAN class=spacer> </SPAN><B
class=country>中国</B><SPAN class=spacer> [</SPAN><A
class=ur-link
href="http://www.ibm.com/developerworks/cn/country/">选择</A><SPAN
class=spacer>]</SPAN></TD>
<TD class=upper-masthead-divider
width=29> </TD>
<TD align=left><A class=ur-link
href="http://www.ibm.com/legal/cn/">使用条款</A></TD></TR></TBODY></TABLE></TD>
<TD width=40> </TD></TR>
<TR>
<TD class=cty-tou-border colSpan=2 height=1><IMG height=1 alt=""
src="掌握 Ajax，第 5 部分 操纵 DOM.files/c.gif" width=1></TD></TR>
<TR>
<TD colSpan=3><IMG height=8 alt=""
src="掌握 Ajax，第 5 部分 操纵 DOM.files/c.gif" width=1></TD></TR>
<TR>
<TD> </TD>
<TD align=middle colSpan=2>
<FORM id=form1 name=form1
action=http://www-128.ibm.com/developerworks/search/searchResults.jsp
method=get><INPUT type=hidden value=1 name=searchType><INPUT
type=hidden value=dWChina name=searchSite><INPUT type=hidden
value=zh name=pageLang><INPUT type=hidden value=UTF8
name=langEncoding>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD width=1><IMG height=1 alt="Select a scope:"
src="掌握 Ajax，第 5 部分 操纵 DOM.files/c.gif" width=1></TD>
<TD align=right><LABEL for=sq><SELECT class=input-scope id=sq
name=searchScope><OPTION value=dW selected>dW
全部内容</OPTION><OPTION
value=dW>-----------------</OPTION><OPTION
value=aixunix> AIX and UNIX</OPTION><OPTION
value=dmdd> Information
management</OPTION><OPTION
value=lotusdd> Lotus</OPTION><OPTION
value=rdd> Rational</OPTION><OPTION
value=tivolidd> Tivoli</OPTION><OPTION
value=wsdd> WebSphere</OPTION><OPTION
value=workplace> Workplace</OPTION><OPTION
value=dW>-----------------</OPTION><OPTION
value=gridZ> Grid computing</OPTION><OPTION
value=javaZ> Java 技术</OPTION><OPTION
value=linuxZ> Linux</OPTION><OPTION
value=opensrcZ> Open source</OPTION><OPTION
value=securityZ> Security</OPTION><OPTION
value=webservZ> SOA & Web
services</OPTION><OPTION value=webarchZ> Web
development</OPTION><OPTION
value=xmlZ> XML</OPTION><OPTION
value=dW>-----------------</OPTION><OPTION value=all>IBM
全部内容</OPTION></SELECT></LABEL></TD>
<TD align=right width=1><IMG height=1 alt="Search for:"
src="掌握 Ajax，第 5 部分 操纵 DOM.files/c.gif"
width=1> </TD>
<TD align=right><INPUT class=input id=q maxLength=100 size=15
name=query></TD>
<TD width=7> </TD>
<TD><LABEL for=q><INPUT type=image alt=搜索
src="掌握 Ajax，第 5 部分 操纵 DOM.files/search.gif" value=搜索
name=Search></LABEL></TD>
<TD
width=20> </TD></TR></TBODY></TABLE></FORM></TD></TR></TBODY></TABLE></TD></TR>
<TR>
<TD class=blbg colSpan=3>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD><SPAN class=spacer> </SPAN></TD>
<TD><A class=masthead-mainlink
href="http://www.ibm.com/cn/">首页</A></TD>
<TD class=masthead-divider
width=27> </TD>
<TD><A class=masthead-mainlink
href="http://www.ibm.com/products/cn/">产品</A></TD>
<TD class=masthead-divider
width=27> </TD>
<TD><A class=masthead-mainlink
href="http://www.ibm.com/servicessolutions/cn/">服务与解决方案</A></TD>
<TD class=masthead-divider
width=27> </TD>
<TD><A class=masthead-mainlink
href="http://www.ibm.com/support/cn/">支持与下载</A></TD>
<TD class=masthead-divider
width=27> </TD>
<TD><A class=masthead-mainlink
href="http://www.ibm.com/account/cn/">个性化服务</A></TD>
<TD><SPAN
class=spacer> </SPAN></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><!--
<script src="//www.ibm.com/common/v14/pmh.js" language="JavaScript" type="text/javascript"></script>
--><!-- end masthead dw liquid --><!--MASTHEAD_END--><!-- CMA ID for this content is: 110934 -->
<TABLE id=v14-body-table cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR vAlign=top><!--LEFTNAV_BEGIN-->
<TD id=navigation width=150>
<TABLE cellSpacing=0 cellPadding=0 width=150 border=0>
<TBODY>
<TR>
<TD class=left-nav-spacer><A class=left-nav-overview
href="http://www.ibm.com/developerworks/cn/"> </A></TD></TR></TBODY></TABLE>
<TABLE cellSpacing=0 cellPadding=0 width=150 border=0>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -