企业🤖AI Agent构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
## **虚拟DOM描述**: * React 提供了一些 API 来创建一种 “特别” 的一般 js 对象 ```JavaScript var element = React.createElement('h1', {id:'myTitle'},'hello') ``` > 上面创建的就是一个简单的虚拟 DOM 对象 * 虚拟 DOM 对象最终都会被 React 转换为真实的 DOM * 我们编码时基本只需要操作 react 的虚拟 DOM 相关数据, react 会转换为真实 DOM 变化而更新界面# ## **真实DOM和虚拟DOM的比较:** ```javascript <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Hello React!</title> <script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script> <script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script> </head> <body> <div id="app"></div> <script> console.dir(React) const vDOM=React.createElement('h1',{id:'title',className:'head'},'Hello React') console.dir(vDOM) ReactDOM.render( vDOM, document.getElementById('app') ); const DOM=document.getElementById('title') console.dir(DOM) </script> </body> </html> ```