浅谈DOM之五：处理节点（1）

roych

       先说点题外话吧。事实上写这个系列，应该是一件吃力不讨好的事情。大部分版友可能会觉得：一是没必要在Access里弄DOM，二是觉得要么在服务器端弄DOM。针对这两种意见，我想说说我的初衷吧。       其实，在开篇里我已经提到过了，这个系列的主要目的在于：一是照顾有网抓需要的版友，二是照顾需要使用Web UI的版友。事实上，我没打算非要给前端工程师看，而且这个系列也不适合，毕竟前端工程师应该学JavaScript，而不是VBA。好了，现在我们继续：

       前面说过了，我们可以通过修改InnerHTML来增删改节点，也可以通过appendChild、removeChild，replaceChild等方法来完成同样的操作。我们先来一个简单点的循环：

1. Private Sub cmdCreateElement_Click()
   
2. Dim wb As WebBrowser
   
3. Dim doc As HTMLDocument
   
4. '定义一个元素数组
   
5. Dim p(1 To 10)  As IHTMLElement
   
6. '定义文本节点
   
7. Dim nodeText As IHTMLDOMNode
   
8. Dim i As Long
   
9. 
   
10. Set wb = Me.WebBrowser0.Object
    
11. Set doc = wb.Document
    
12. For i = 1 To 10
    
13. '创建P元素
    
14.     Set p(i) = doc.createElement("p")
    
15. '创建文本节点
    
16.     Set nodeText = doc.createTextNode("我是新来的" & i)
    
17. '将文本节点附到P元素上
    
18.     p(i).appendChild nodeText
    
19. '再将已经包含文本的P节点添加到BODY上
    
20.     doc.querySelector("body").appendChild p(i)
    
21. Next
    
22. 
    
23. End Sub

复制代码

      关于上述的语句，有专家说，由于处理节点时，浏览器需要一次次去渲染，会耗费大量资源。不过也有人认为，用DocumentFragment与这相比并没有太大差异。这个问题我们后面再讨论。
       接下来，我们再来一个复杂点的。将数据显示在表格中：

1. Private Sub cmdCreateElement_Click()
   
2. Dim wb As WebBrowser
   
3. Dim doc As HTMLDocument
   
4. '定义表格的行（tr）跟列（td）
   
5. Dim td  As IHTMLElement
   
6. Dim tr() As IHTMLElement
   
7. Dim nodeText As IHTMLDOMNode
   
8. '定义记录集
   
9. Dim rst As New ADODB.Recordset
   
10. '定循环变量i和outerHTML文本
    
11. Dim i As Long
    
12. Dim s As String
    
13. 
    
14. rst.Open "select 商品ID,商品名称,结算金额 from 订单数据", CurrentProject.Connection, adOpenKeyset, adLockOptimistic
    
15. 
    
16. Set wb = Me.WebBrowser0.Object
    
17. Set doc = wb.Document
    
18. '重定义数组
    
19. ReDim tr(1 To rst.RecordCount)
    
20. i = 1
    
21. 
    
22. Do Until rst.EOF
    
23.     Set tr(i) = doc.createElement("tr")
    
24.     For j = 0 To rst.Fields.Count - 1
    
25.     '创建单元格
    
26.         Set td = doc.createElement("td")
    
27.     '创建文本节点
    
28.         Set nodeText = doc.createTextNode(rst(j))
    
29.     '将文本节点依次附加到单元格之上，得到：<td>rst(0)</td><td>rst(1)</td><td>rst(2)</td>
    
30.         td.appendChild nodeText
    
31.     '将td附加到tr上。
    
32.         tr(i).appendChild td
    
33.     Next
    
34. '读取外部HTML代码
    
35. s = s & tr(i).outerHTML
    
36. '循环
    
37. i = i + 1
    
38. rst.MoveNext
    
39. Loop
    
40. doc.querySelector("body").innerHTML = "<table border=""1"">" & s & "</table>"
    
41. End Sub

复制代码

上一节 下一节

admin

系列文章。赞一个

roych

admin 发表于 2015-7-6 17:31
系列文章。赞一个

既然讲了，就尽量讲透一些。不过JavaScript的DOM跟VBA里的DOM还是有些差异。例如部分appendChild就是IHTMLElement里的隐藏方法（即无提示，只能手动输入这个方法）。

tmtony

赞一个！

qjiangxi

大师都已经拼合ACCESS和HTML了，我还一直晕HTML，研究有一段时间了，还停留在改别人现成的。
留个记号跟帖……

leonshi

赞一个