Question

react渲染之后怎么进行dom操作

Answer 1

　　1、创建元素节点
　　创建元素节点并且把节点作为<ul>元素的子节点添加到DOM节点树上。先创建元素点，创建元素节点使用Jquery的工厂函数$()来完成，格式如下：$(html),该方法会根据传入的html字符串返回一个DOM对象，并将DOM对象包装成一个JQuery对象后返回。创建一个元素节点JQuery代码如下：
　　$li1=$("<li></li>")
　　代码返回$li1就是一个由DOM对象包装成的JQuery对象。把新建节点添加到DOM树中JQuery代码如下：
　　$("ul").append($li1);
　　添加后页面中只能看到<li>元素默认的"·",由于没有为节点添加文本所以只显示默认符号，下面创建文本节点。
　　PS:append()方法是添加DOM节点方法详见增--添加DOM节点。

　　2、创建文本节点
　　使用JQuery的工厂函数$()同样能够创建文本节点，创建文本节点的JQuery代码如下：
　　$li2=$("<li>苹果</li>");
　　代码返回$li2就是一个由DOM对象包装成JQuery对象，把新建的文本节点添加到DOM树中JQuery代码如下：
　　$("ul").append($li2);
　　添加后页面中能看到"·苹果"，右键查看页面源码发现新加的文本节点没有title属性。下面方法创建带属性的节点。
　　3、创建属性节点
　　创建属性节点同元素节点、文本节点一样使用JQuery的工厂函数完成。创建属性节点的JQuery代码如下：
　　$li3=$("<li title='榴莲'>榴莲</li>");
　　代码返回$li3也是一个由DOM对象包装成JQuery对象，把新建的属性节点添加到DOM树中JQuery代码如下：
　　$("ul").append($li3);
　　添加后页面中能看到"·榴莲"，右键查看页面源码发现新加的属性节点有title='榴莲'属性。