AJAX非常棒的教程_ajax_javascript_其他

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8"> <meta name="generator" content="pdf2htmlEX"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <link rel="stylesheet" href="https://static.pudn.com/base/css/base.min.css"> <link rel="stylesheet" href="https://static.pudn.com/base/css/fancy.min.css"> <link rel="stylesheet" href="https://static.pudn.com/prod/directory_preview_static/624f9ba16caf596192e5ef8d/raw.css"> <script src="https://static.pudn.com/base/js/compatibility.min.js"></script> <script src="https://static.pudn.com/base/js/pdf2htmlEX.min.js"></script> <script> try{ pdf2htmlEX.defaultViewer = new pdf2htmlEX.Viewer({}); }catch(e){} </script> <title></title> </head> <body> <div id="sidebar" style="display: none"> <div id="outline"> </div> </div> <div id="pf1" class="pf w0 h0" data-page-no="1"><div class="pc pc1 w0 h0"><img class="bi x0 y0 w1 h1" alt="" src="https://static.pudn.com/prod/directory_preview_static/624f9ba16caf596192e5ef8d/bg1.jpg"><div class="t m0 x1 h2 y1 ff1 fs0 fc0 sc0 ls0 ws0">Javascript<span class="_"> </span><span class="ff2 sc1 ls1">学习第一季（</span><span class="ls2">6<span class="ff2 sc1">）</span> </span></div><div class="t m0 x2 h2 y2 ff1 fs0 fc0 sc0 ls2 ws0"> </div><div class="t m0 x3 h3 y3 ff2 fs1 fc0 sc0 ls2 ws0">上篇文章纳闷的问题，将在这章和以后的几章里，慢慢搞定。<span class="ff3"> </span></div><div class="t m0 x3 h3 y4 ff2 fs1 fc0 sc0 ls2 ws0">从今天起，开始学习<span class="_ _0"> </span><span class="ff3 ls3">DOM<span class="_"> </span></span>编程<span class="ff3 ls4"> </span>让我们慢慢称为一名初级的<span class="_ _0"> </span><span class="ff3 ls5">js<span class="_"> </span></span><span class="sc1 ls6">程序员</span>。<span class="ff3"> </span></div><div class="t m0 x3 h3 y5 ff2 fs1 fc0 sc0 ls2 ws0">然后往<span class="_ _0"> </span><span class="ff3 ls5">js<span class="_"> </span></span><span class="sc1 ls6">匠人</span>方向发展。<span class="ff3"> </span></div><div class="t m0 x3 h3 y6 ff3 fs1 fc0 sc0 ls2 ws0"> </div><div class="t m0 x3 h3 y7 ff2 fs1 fc0 sc0 ls2 ws0">学习英文：<span class="ff3"> </span></div><div class="t m0 x3 h4 y8 ff2 fs1 fc1 sc0 ls2 ws0">Dom<span class="fc0">：文档对象模型。Document object model </span></div><div class="t m0 x3 h4 y9 ff2 fs1 fc1 sc0 ls2 ws0">Bom：<span class="fc0">浏览器对象模型。 </span></div><div class="t m0 x3 h4 ya ff2 fs1 fc2 sc0 ls2 ws0">注：也可以叫窗口对象模型。<span class="_ _1"></span>（window object model.） </div><div class="t m0 x3 h4 yb ff2 fs1 fc1 sc0 ls2 ws0">API<span class="fc0">：应用编程接口。 </span></div><div class="t m0 x3 h4 yc ff2 fs1 fc2 sc0 ls2 ws0">注：DOM<span class="_ _0"> </span>其实可以看作一种<span class="_ _0"> </span>API。 </div><div class="t m0 x3 h4 yd ff2 fs1 fc1 sc0 ls2 ws0">Node<span class="fc0">：节点。 </span></div><div class="t m0 x3 h4 ye ff2 fs1 fc2 sc0 ls2 ws0">注：节点分为：元素节点，属性节点，文本节点。 </div><div class="t m0 x3 h4 yf ff2 fs1 fc2 sc0 ls2 ws0">元素节点 包含 属性节点和文本节点。 </div><div class="t m0 x3 h4 y10 ff2 fs1 fc2 sc0 ls2 ws0"> </div><div class="t m0 x3 h4 y11 ff2 fs1 fc2 sc0 ls2 ws0">Dom<span class="_ _0"> </span>树： </div></div><div class="pi" data-data='{"ctm":[1.864011,0.000000,0.000000,1.864011,0.000000,0.000000]}'></div></div> </body> </html>

<div id="pf2" class="pf w0 h0" data-page-no="2"><div class="pc pc2 w0 h0"><img class="bi x0 y0 w1 h1" alt="" src="https://static.pudn.com/prod/directory_preview_static/624f9ba16caf596192e5ef8d/bg2.jpg"><div class="t m0 x4 h4 y12 ff2 fs1 fc2 sc0 ls2 ws0"> </div><div class="t m0 x3 h4 y13 ff2 fs1 fc2 sc0 ls2 ws0"> </div><div class="t m0 x3 h4 y14 ff2 fs1 fc2 sc0 ls2 ws0"> </div><div class="t m0 x3 h4 y15 ff2 fs1 fc0 sc0 ls2 ws0">下面我们直接看 到底怎么操作<span class="_ _0"> </span>DOM。 </div><div class="t m0 x3 h5 y16 ff1 fs2 fc2 sc0 ls2 ws0">1<span class="ff2 sc2">，</span><span class="ff4"> <span class="_ _2"></span><span class="ff2 sc2">创建元素节点<span class="_ _3"></span>。<span class="ff3 sc0 ls7">createElement():<span class="ff1 ls2"> </span></span></span></span></div><div class="t m0 x3 h3 y17 ff3 fs1 fc1 sc0 ls8 ws1"><SCRIPT LANGUAGE="JavaScript"> </div><div class="t m0 x3 h3 y18 ff3 fs1 fc1 sc0 ls9 ws2"> var <span class="_ _4"></span>a = <span class="_ _4"></span>document.createElement("p"); </div><div class="t m0 x3 h3 y19 ff3 fs1 fc1 sc0 lsa ws3"> alert( <span class="_ _4"></span>"<span class="ff2 ls2 ws0">节点类型是<span class="ff3 ls4"> </span>：</span><span class="lsb ws4"> " <span class="_ _4"></span>+a.nodeT<span class="_ _2"></span>ype + " <span class="_ _4"></span>, <span class="ff2 ls2 ws0">节点名称<span class="_ _5"></span>是：<span class="ff3 lsc ws5"> " + a.nodeName); </span></span></span></div><div class="t m0 x3 h3 y1a ff3 fs1 fc1 sc0 lsd ws0"></SCRIPT> </div><div class="t m0 x3 h3 y1b ff2 fs1 fc0 sc0 ls2 ws0">输出<span class="ff3 lse ws6"> ; nodeT<span class="_ _2"></span>ype <span class="ff2 ls2 ws0">是</span><span class="lsf ws7"> 1 . a.nodeNam<span class="_ _5"></span>e <span class="ff2 ls2 ws0">是<span class="ff3 ls4"> p<span class="_ _4"></span> <span class="_ _4"></span>;<span class="_ _4"></span> </span></span></span></span></div><div class="t m0 x3 h3 y1c ff2 fs1 fc0 sc0 ls2 ws0">所以它创建的是一个元素节点<span class="ff3 ws8"> ….</span>你也许会想<span class="ff3 ls4"> </span>为什么文档中没发现<span class="ff3"> <span class="_"> </span></span>节点<span class="ff3 ls4"> p</span>呢？<span class="ff3"> </span></div><div class="t m0 x3 h3 y1d ff2 fs1 fc0 sc0 ls2 ws0">我们看下面例子：<span class="ff3"> </span></div><div class="t m0 x3 h3 y1e ff3 fs1 fc1 sc0 ls9 ws0"><body> </div><div class="t m0 x3 h3 y1f ff3 fs1 fc1 sc0 ls10 ws0"></body> </div><div class="t m0 x3 h3 y20 ff3 fs1 fc1 sc0 ls8 ws1"><SCRIPT LANGUAGE="JavaScript"> </div></div><div class="pi" data-data='{"ctm":[1.864011,0.000000,0.000000,1.864011,0.000000,0.000000]}'></div></div>