use mountNode replace the long getElementById

components/affix/demo/basic.md

@@ -13,5 +13,5 @@ ReactDOM.render(
   <Affix>
     <Button type="primary">固定在顶部</Button>
   </Affix>
-, document.getElementById('components-affix-demo-basic'));
+, mountNode);
 ````

components/affix/demo/offset.md

@@ -13,5 +13,5 @@ ReactDOM.render(
   <Affix offset={75}>
     <Button type="primary">固定在距离顶部 75px 的位置</Button>
   </Affix>
-, document.getElementById('components-affix-demo-offset'));
+, mountNode);
 ````

components/alert/demo/basic.md

@@ -10,5 +10,5 @@
 import { Alert } from 'antd';
 
 ReactDOM.render(<Alert message="成功提示的文案" type="success" />
-, document.getElementById('components-alert-demo-basic'));
+, mountNode);
 ````

components/alert/demo/closable.md

@@ -23,5 +23,5 @@ ReactDOM.render(<div>
     type="error"
     closable
     onClose={onClose} />
-</div>, document.getElementById('components-alert-demo-closable'));
+</div>, mountNode);
 ````

components/alert/demo/close-text.md

@@ -11,5 +11,5 @@ import { Alert } from 'antd';
 
 ReactDOM.render(
 <Alert message="消息提示的文案" type="info" closeText="不再提醒" />
-, document.getElementById('components-alert-demo-close-text'));
+, mountNode);
 ````

components/alert/demo/description.md

@@ -24,5 +24,5 @@ ReactDOM.render(<div>
     message="错误提示的文案"
     description="错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍"
     type="error" />
-</div>, document.getElementById('components-alert-demo-description'));
+</div>, mountNode);
 ````

components/alert/demo/icon.md

@@ -32,5 +32,5 @@ ReactDOM.render(<div>
     description="错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍"
     type="error"
     showIcon />
-</div>, document.getElementById('components-alert-demo-icon'));
+</div>, mountNode);
 ````

components/alert/demo/style.md

@@ -15,5 +15,5 @@ ReactDOM.render(<div>
   <Alert message="警告提示的文案" type="warn" />
   <Alert message="错误提示的文案" type="error" />
 </div>,
-document.getElementById('components-alert-demo-style'));
+mountNode);
 ````

components/badge/demo/99plus.md

@@ -16,5 +16,5 @@ ReactDOM.render(<div>
   <Badge count={200}>
     <a href="#" className="head-example"></a>
   </Badge>
-</div>, document.getElementById('components-badge-demo-99plus'));
+</div>, mountNode);
 ````

components/badge/demo/basic.md

@@ -13,7 +13,7 @@ ReactDOM.render(
   <Badge count={5}>
     <a href="#" className="head-example"></a>
   </Badge>
-, document.getElementById('components-badge-demo-basic'));
+, mountNode);
 ````
 
 ````css

components/badge/demo/change.md

@@ -69,5 +69,5 @@ const Test = React.createClass({
 
 ReactDOM.render(
   <Test />
-, document.getElementById('components-badge-demo-change'));
+, mountNode);
 ````

components/badge/demo/dot.md

@@ -16,7 +16,7 @@ ReactDOM.render(<div>
   <Badge dot>
     <a href="#">一个链接</a>
   </Badge>
-</div>, document.getElementById('components-badge-demo-dot'));
+</div>, mountNode);
 ````
 
 <style>

components/badge/demo/link.md

@@ -15,5 +15,5 @@ ReactDOM.render(
       <span className="head-example"></span>
     </Badge>
   </a>
-, document.getElementById('components-badge-demo-link'));
+, mountNode);
 ````

components/badge/demo/no-wrapper.md

@@ -15,5 +15,5 @@ ReactDOM.render(<div>
   <Badge count={25} />
   <Badge count={4} style={{backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9'}} />
   <Badge count={109} style={{backgroundColor: '#87d068'}} />
-</div>, document.getElementById('components-badge-demo-no-wrapper'));
+</div>, mountNode);
 ````

components/badge/demo/overflow.md

@@ -16,5 +16,5 @@ ReactDOM.render(<div>
   <Badge count={1000} overflowCount={999}>
     <a href="#" className="head-example"></a>
   </Badge>
-</div>, document.getElementById('components-badge-demo-overflow'));
+</div>, mountNode);
 ````

components/breadcrumb/demo/basic.md

@@ -16,5 +16,5 @@ ReactDOM.render(
     <Breadcrumb.Item href="">应用列表</Breadcrumb.Item>
     <Breadcrumb.Item>某应用</Breadcrumb.Item>
   </Breadcrumb>
-, document.getElementById('components-breadcrumb-demo-basic'));
+, mountNode);
 ````

components/breadcrumb/demo/router.md

@@ -47,7 +47,7 @@ ReactDOM.render((
       </Route>
     </Route>
   </Router>
-), document.getElementById('components-breadcrumb-demo-router'));
+), mountNode);
 ````
 
 <style>

components/breadcrumb/demo/separator.md

@@ -16,5 +16,5 @@ ReactDOM.render(
     <Breadcrumb.Item href="">应用列表</Breadcrumb.Item>
     <Breadcrumb.Item>某应用</Breadcrumb.Item>
   </Breadcrumb>
-, document.getElementById('components-breadcrumb-demo-separator'));
+, mountNode);
 ````

components/breadcrumb/demo/withIcon.md

@@ -22,6 +22,6 @@ ReactDOM.render(
       应用
     </Breadcrumb.Item>
   </Breadcrumb>
-, document.getElementById('components-breadcrumb-demo-withicon'));
+, mountNode);
 ````
 

components/button/demo/basic.md

@@ -19,7 +19,7 @@ ReactDOM.render(<div>
   <Button type="ghost">幽灵按钮</Button>
   <Button type="dashed">虚线按钮</Button>
 </div>,
-document.getElementById('components-button-demo-basic'));
+mountNode);
 ````
 
 <style>

components/button/demo/button-group.md

@@ -79,7 +79,7 @@ ReactDOM.render(<div>
   <Button type="ghost">小</Button>
 </ButtonGroup>
 </div>
-, document.getElementById('components-button-demo-button-group'));
+, mountNode);
 ````
 
 <style>

components/button/demo/disabled.md

@@ -22,7 +22,7 @@ ReactDOM.render(<div>
   <Button type="dashed">虚线按钮</Button>
   <Button type="dashed" disabled>虚线按钮(失效)</Button>
 </div>
-, document.getElementById('components-button-demo-disabled'));
+, mountNode);
 ````
 
 <style>

components/button/demo/icon.md

@@ -46,7 +46,7 @@ ReactDOM.render(<div>
     <Icon type="search" />
   </Button>
 </div>,
-document.getElementById('components-button-demo-icon'));
+mountNode);
 ````
 
 <style>

components/button/demo/loading.md

@@ -44,7 +44,7 @@ const App = React.createClass({
   }
 });
 
-ReactDOM.render(<App />, document.getElementById('components-button-demo-loading'));
+ReactDOM.render(<App />, mountNode);
 ````
 
 <style>

components/button/demo/shape.md

@@ -30,7 +30,7 @@ ReactDOM.render(<div>
     <Icon type="search" />
   </Button>
 </div>
-, document.getElementById('components-button-demo-shape'));
+, mountNode);
 ````
 
 <style>

components/button/demo/size.md

@@ -16,7 +16,7 @@ ReactDOM.render(<div>
   <Button type="primary">中号按钮(默认)</Button>
   <Button type="primary" size="small">小号按钮</Button>
 </div>
-, document.getElementById('components-button-demo-size'));
+, mountNode);
 ````
 
 <style>

components/calendar/demo/basic.md

@@ -15,5 +15,5 @@ function onPanelChange(value, mode) {
 
 ReactDOM.render(
   <Calendar onPanelChange={onPanelChange} />
-, document.getElementById('components-calendar-demo-basic'));
+, mountNode);
 ````

components/calendar/demo/card.md

@@ -17,5 +17,5 @@ ReactDOM.render(
   <div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}>
     <Calendar fullscreen={false} onPanelChange={onPanelChange} />
   </div>
-, document.getElementById('components-calendar-demo-card'));
+, mountNode);
 ````

components/calendar/demo/custom-render.md

@@ -20,5 +20,5 @@ function monthCellRender(value) {
 ReactDOM.render(
   <Calendar defaultValue={new Date('2010-10-10')}
   dateCellRender={dateCellRender} monthCellRender={monthCellRender} />
-, document.getElementById('components-calendar-demo-custom-render'));
+, mountNode);
 ````

components/calendar/demo/locale.md

@@ -16,5 +16,5 @@ function onPanelChange(value, mode) {
 
 ReactDOM.render(
   <Calendar onPanelChange={onPanelChange} locale={enUS}/>
-, document.getElementById('components-calendar-demo-locale'));
+, mountNode);
 ````

components/calendar/demo/notice-calendar.md

@@ -66,7 +66,7 @@ function monthCellRender(value) {
 
 ReactDOM.render(
   <Calendar dateCellRender={dateCellRender} monthCellRender={monthCellRender} />
-, document.getElementById('components-calendar-demo-notice-calendar'));
+, mountNode);
 ````
 
 

components/carousel/demo/autoplay.md

@@ -16,6 +16,6 @@ ReactDOM.render(
     <div><h3>3</h3></div>
     <div><h3>4</h3></div>
   </Carousel>
-, document.getElementById('components-carousel-demo-autoplay'));
+, mountNode);
 ````
 

components/carousel/demo/basic.md

@@ -20,5 +20,5 @@ ReactDOM.render(
     <div><h3>3</h3></div>
     <div><h3>4</h3></div>
   </Carousel>
-, document.getElementById('components-carousel-demo-basic'));
+, mountNode);
 ````

components/carousel/demo/fade.md

@@ -16,6 +16,6 @@ ReactDOM.render(
     <div><h3>3</h3></div>
     <div><h3>4</h3></div>
   </Carousel>
-, document.getElementById('components-carousel-demo-fade'));
+, mountNode);
 ````
 

components/carousel/demo/vertical.md

@@ -16,5 +16,5 @@ ReactDOM.render(
     <div><h3>3</h3></div>
     <div><h3>4</h3></div>
   </Carousel>
-, document.getElementById('components-carousel-demo-vertical'));
+, mountNode);
 ````

components/checkbox/demo/basic.md

@@ -16,5 +16,5 @@ function onChange(e) {
 ReactDOM.render(<label>
   <Checkbox defaultChecked={false} onChange={onChange} />
   Checkbox
-</label>, document.getElementById('components-checkbox-demo-basic'));
+</label>, mountNode);
 ````

components/checkbox/demo/controller.md

@@ -55,5 +55,5 @@ const App = React.createClass({
   }
 });
 
-ReactDOM.render(<App />, document.getElementById('components-checkbox-demo-controller'));
+ReactDOM.render(<App />, mountNode);
 ````

components/checkbox/demo/disable.md

@@ -13,5 +13,5 @@ ReactDOM.render(<div>
   <Checkbox defaultChecked={false} disabled />
   <br />
   <Checkbox defaultChecked disabled />
-</div>, document.getElementById('components-checkbox-demo-disable'));
+</div>, mountNode);
 ````

components/checkbox/demo/group.md

@@ -16,5 +16,5 @@ function onChange(checkedValues) {
 
 ReactDOM.render(
   <CheckboxGroup options={['Apple', 'Pear', 'Orange']} defaultValue={['Apple']} onChange={onChange} />
-, document.getElementById('components-checkbox-demo-group'));
+, mountNode);
 ````

components/collapse/demo/accordion.md

@@ -28,5 +28,5 @@ ReactDOM.render(
       <p>{text}</p>
     </Panel>
   </Collapse>
-, document.getElementById('components-collapse-demo-accordion'));
+, mountNode);
 ````

components/collapse/demo/basic.md

@@ -32,5 +32,5 @@ ReactDOM.render(
       <p>{text}</p>
     </Panel>
   </Collapse>
-, document.getElementById('components-collapse-demo-basic'));
+, mountNode);
 ````

components/collapse/demo/mix.md

@@ -36,5 +36,5 @@ ReactDOM.render(
       <p>{text}</p>
     </Panel>
   </Collapse>
-, document.getElementById('components-collapse-demo-mix'));
+, mountNode);
 ````

components/date-picker/demo/basic.md

@@ -13,7 +13,5 @@ function onChange(value) {
   console.log(value);
 }
 
-ReactDOM.render(
-  <DatePicker onChange={onChange} />
-, document.getElementById('components-date-picker-demo-basic'));
+ReactDOM.render(<DatePicker onChange={onChange} />, mountNode);
 ````

components/date-picker/demo/disabled-date.md

@@ -18,5 +18,5 @@ const disabledDate = function(current) {
 
 ReactDOM.render(
   <DatePicker disabledDate={disabledDate} />
-, document.getElementById('components-date-picker-demo-disabled-date'));
+, mountNode);
 ````

components/date-picker/demo/disabled.md

@@ -11,5 +11,5 @@ import { DatePicker } from 'antd';
 
 ReactDOM.render(
   <DatePicker defaultValue="2015-06-06" disabled />
-, document.getElementById('components-date-picker-demo-disabled'));
+, mountNode);
 ````

components/date-picker/demo/formatter.md

@@ -11,5 +11,5 @@ import { DatePicker } from 'antd';
 
 ReactDOM.render(
   <DatePicker defaultValue="2015/01/01" format="yyyy/MM/dd" />
-, document.getElementById('components-date-picker-demo-formatter'));
+, mountNode);
 ````

components/date-picker/demo/locale.md

@@ -26,6 +26,6 @@ const App = React.createClass({
   }
 });
 
-ReactDOM.render(<App />, document.getElementById('components-date-picker-demo-locale'));
+ReactDOM.render(<App />, mountNode);
 ````
 

components/date-picker/demo/month-picker.md

@@ -11,5 +11,5 @@ import { DatePicker } from 'antd';
 const MonthPicker = DatePicker.MonthPicker;
 ReactDOM.render(
   <MonthPicker defaultValue="2015-12" />
-, document.getElementById('components-date-picker-demo-month-picker'));
+, mountNode);
 ````

components/date-picker/demo/range.md

@@ -17,5 +17,5 @@ ReactDOM.render(<div>
   <RangePicker style={{width: 184}} onChange={onChange} />
   <br />
   <RangePicker showTime format="yyyy-MM-dd HH:mm:ss" onChange={onChange} />
-</div>, document.getElementById('components-date-picker-demo-range'));
+</div>, mountNode);
 ````

components/date-picker/demo/size.md

@@ -15,5 +15,5 @@ ReactDOM.render(
     <DatePicker />
     <DatePicker size="small" />
   </div>
-, document.getElementById('components-date-picker-demo-size'));
+, mountNode);
 ````

components/date-picker/demo/start-end.md

@@ -50,5 +50,5 @@ const DateRange = React.createClass({
 
 ReactDOM.render(
   <DateRange />
-, document.getElementById('components-date-picker-demo-start-end'));
+, mountNode);
 ````

components/date-picker/demo/time.md

@@ -15,5 +15,5 @@ function onChange(value) {
 
 ReactDOM.render(
 <DatePicker showTime format="yyyy-MM-dd HH:mm:ss" onChange={onChange} style={{width: 160}} />
-, document.getElementById('components-date-picker-demo-time'));
+, mountNode);
 ````

components/date-picker/demo/with-time-picker.md

@@ -49,5 +49,5 @@ function onSelect(value) {
 }
 
 ReactDOM.render(<DateTimePicker onSelect={onSelect} />
-, document.getElementById('components-date-picker-demo-with-time-picker'));
+, mountNode);
 ````

components/dropdown/demo/basic.md

@@ -27,5 +27,5 @@ ReactDOM.render(
       触发链接 <Icon type="down" />
     </a>
   </Dropdown>
-, document.getElementById('components-dropdown-demo-basic'));
+, mountNode);
 ````

components/dropdown/demo/dropdown-button.md

@@ -26,5 +26,5 @@ ReactDOM.render(
 <DropdownButton overlay={menu} type="primary">
   某功能按钮
 </DropdownButton>
-, document.getElementById('components-dropdown-demo-dropdown-button'));
+, mountNode);
 ````

components/dropdown/demo/event.md

@@ -24,5 +24,5 @@ ReactDOM.render(
       鼠标移入，点击菜单 <Icon type="down" />
     </a>
   </Dropdown>
-, document.getElementById('components-dropdown-demo-event'));
+, mountNode);
 ````

components/dropdown/demo/item.md

@@ -26,5 +26,5 @@ ReactDOM.render(
       鼠标移入 <Icon type="down" />
     </a>
   </Dropdown>
-, document.getElementById('components-dropdown-demo-item'));
+, mountNode);
 ````

components/dropdown/demo/trigger.md

@@ -26,5 +26,5 @@ ReactDOM.render(<div>
       点击触发 <Icon type="down" />
     </a>
   </Dropdown>
-</div>, document.getElementById('components-dropdown-demo-trigger'));
+</div>, mountNode);
 ````

components/form/demo/disabled.md

@@ -46,5 +46,5 @@ ReactDOM.render(
       </Row>
     </fieldset>
   </Form>
-, document.getElementById('components-form-demo-disabled'));
+, mountNode);
 ````

components/form/demo/form-controls.md

@@ -91,5 +91,5 @@ ReactDOM.render(
         </RadioGroup>
     </FormItem>
   </Form>
-, document.getElementById('components-form-demo-form-controls'));
+, mountNode);
 ````

components/form/demo/horizontal-form.md

@@ -92,5 +92,5 @@ const Demo = React.createClass({
   }
 });
 
-ReactDOM.render(<Demo />, document.getElementById('components-form-demo-horizontal-form'));
+ReactDOM.render(<Demo />, mountNode);
 ````

components/form/demo/inline-form.md

@@ -58,5 +58,5 @@ const Demo = React.createClass({
   }
 });
 
-ReactDOM.render(<Demo />, document.getElementById('components-form-demo-inline-form'));
+ReactDOM.render(<Demo />, mountNode);
 ````

components/form/demo/input-group.md

@@ -93,5 +93,5 @@ ReactDOM.render(
     </FormItem>
   </Form>
 
-, document.getElementById('components-form-demo-input-group'));
+, mountNode);
 ````

components/form/demo/input.md

@@ -27,5 +27,5 @@ ReactDOM.render(
       </Col>
     </InputGroup>
   </Row>
-, document.getElementById('components-form-demo-input'));
+, mountNode);
 ````

components/form/demo/mix.md

@@ -115,5 +115,5 @@ const Demo = React.createClass({
   }
 });
 
-ReactDOM.render(<Demo />, document.getElementById('components-form-demo-mix'));
+ReactDOM.render(<Demo />, mountNode);
 ````

components/form/demo/search-input.md

@@ -57,5 +57,5 @@ const SearchInput = React.createClass({
 
 ReactDOM.render(
   <SearchInput placeholder="input search text" style={{width: 200}} />
-, document.getElementById('components-form-demo-search-input'));
+, mountNode);
 ````

components/form/demo/validate.md

@@ -91,5 +91,5 @@ ReactDOM.render(
       </Col>
     </FormItem>
   </Form>
-, document.getElementById('components-form-demo-validate'));
+, mountNode);
 ````

components/icon/index.md

@@ -155,7 +155,7 @@ const icons2 = ['question', 'question-circle-o', 'question-circle', 'plus', 'plu
 const icons3 = ['lock', 'unlock', 'android', 'apple', 'area-chart', 'bar-chart', 'bars', 'book', 'calendar', 'cloud', 'cloud-download', 'code', 'copy', 'credit-card', 'delete', 'desktop', 'download', 'edit', 'ellipsis', 'file', 'file-text', 'file-unknown', 'folder', 'folder-open', 'github', 'hdd', 'frown', 'meh', 'inbox', 'laptop', 'appstore', 'line-chart', 'link', 'logout', 'mail', 'menu-fold', 'menu-unfold', 'mobile', 'notification', 'paper-clip', 'picture', 'pie-chart', 'poweroff', 'reload', 'search', 'setting', 'share-alt', 'shopping-cart', 'smile', 'tablet', 'tag', 'tags', 'to-top', 'upload', 'user', 'video-camera', 'windows', 'ie', 'chrome', 'home', 'loading', 'smile-circle', 'meh-circle', 'frown-circle', 'tags-o', 'tag-o', 'cloud-upload-o', 'cloud-download-o', 'cloud-upload', 'cloud-o', 'star-o', 'star', 'environment', 'environment-o', 'eye', 'eye-o', 'camera', 'camera-o', 'aliwangwang', 'aliwangwang-o', 'save', 'team', 'solution', 'phone', 'filter', 'exception', 'export', 'customerservice', 'qrcode', 'like', 'dislike', 'message', 'pay-circle', 'pay-circle-o'];
 
 
-ReactDOM.render(<IconSet icons={icons1} />, document.getElementById('iconset-direction'));
-ReactDOM.render(<IconSet icons={icons2} />, document.getElementById('iconset-hint'));
-ReactDOM.render(<IconSet icons={icons3} />, document.getElementById('iconset-common'));
+ReactDOM.render(<IconSet icons={icons1} />, mountNode);
+ReactDOM.render(<IconSet icons={icons2} />, mountNode);
+ReactDOM.render(<IconSet icons={icons3} />, mountNode);
 `````

components/input-number/demo/basic.md

@@ -15,6 +15,6 @@ function onChange(value) {
 
 ReactDOM.render(
 <InputNumber min={1} max={10} defaultValue={3} onChange={onChange} />
-, document.getElementById('components-input-number-demo-basic'));
+, mountNode);
 ````
 

components/input-number/demo/disabled.md

@@ -30,5 +30,5 @@ const Test = React.createClass({
   }
 });
 
-ReactDOM.render(<Test />, document.getElementById('components-input-number-demo-disabled'));
+ReactDOM.render(<Test />, mountNode);
 ````

components/input-number/demo/size.md

@@ -19,7 +19,7 @@ ReactDOM.render(
   <InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} />
   <InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} />
 </div>
-, document.getElementById('components-input-number-demo-size'));
+, mountNode);
 ````
 
 ````css

components/layout/demo/basic.md

@@ -29,7 +29,7 @@ ReactDOM.render(
       <Col span="6">.col-6</Col>
     </Row>
   </div>,
-  document.getElementById('components-layout-demo-basic')
+  mountNode
 );
 ````
 

components/layout/demo/flex-align.md

@@ -46,6 +46,6 @@ ReactDOM.render(
       <Col span="4"><DemoBox value="80">.col-4</DemoBox></Col>
     </Row>
   </div>,
-  document.getElementById('components-layout-demo-flex-align')
+  mountNode
 );
 ````

components/layout/demo/flex-order.md

@@ -20,6 +20,6 @@ ReactDOM.render(
       <Col span="6" order="1">4 col-order-1</Col>
     </Row>
   </div>,
-  document.getElementById('components-layout-demo-flex-order')
+  mountNode
 );
 ````

components/layout/demo/flex.md

@@ -53,6 +53,6 @@ ReactDOM.render(
       <Col span="4">.col-4</Col>
     </Row>
   </div>,
-  document.getElementById('components-layout-demo-flex')
+  mountNode
 );
 ````

components/layout/demo/offset.md

@@ -25,6 +25,6 @@ ReactDOM.render(
       <Col span="12" offset="6">.col-12 .col-offset-6</Col>
     </Row>
   </div>,
-  document.getElementById('components-layout-demo-offset')
+  mountNode
 );
 ````

components/layout/demo/sort.md

@@ -18,6 +18,6 @@ ReactDOM.render(
       <Col span="6" pull="18">.col-6 .col-pull-18</Col>
     </Row>
   </div>,
-  document.getElementById('components-layout-demo-sort')
+  mountNode
 );
 ````

components/menu/demo/horizontal.md

@@ -53,5 +53,5 @@ const App = React.createClass({
   }
 });
 
-ReactDOM.render(<App />, document.getElementById('components-menu-demo-horizontal'));
+ReactDOM.render(<App />, mountNode);
 ````

components/menu/demo/sider-current.md

@@ -60,5 +60,5 @@ const Sider = React.createClass({
     </Menu>;
   }
 });
-ReactDOM.render(<Sider />, document.getElementById('components-menu-demo-sider-current'));
+ReactDOM.render(<Sider />, mountNode);
 ````

components/menu/demo/sider.md

@@ -56,5 +56,5 @@ const Sider = React.createClass({
     </Menu>;
   }
 });
-ReactDOM.render(<Sider />, document.getElementById('components-menu-demo-sider'));
+ReactDOM.render(<Sider />, mountNode);
 ````

components/menu/demo/theme.md

@@ -62,6 +62,6 @@ const Sider = React.createClass({
     </div>;
   }
 });
-ReactDOM.render(<Sider />, document.getElementById('components-menu-demo-theme'));
+ReactDOM.render(<Sider />, mountNode);
 ````
 

components/menu/demo/vertical.md

@@ -41,5 +41,5 @@ ReactDOM.render(<Menu onClick={handleClick} style={{width:240}} mode="vertical">
     <Menu.Item key="12">选项12</Menu.Item>
   </SubMenu>
 </Menu>
-, document.getElementById('components-menu-demo-vertical'));
+, mountNode);
 ````

components/message/demo/duration.md

@@ -14,6 +14,6 @@ const success = function() {
 };
 
 ReactDOM.render(<Button onClick={success}>自定义时长提示</Button>
-, document.getElementById('components-message-demo-duration'));
+, mountNode);
 ````
 

components/message/demo/info.md

@@ -14,5 +14,5 @@ const info = function() {
 };
 
 ReactDOM.render(<Button type="primary" onClick={info}>显示普通提醒</Button>
-, document.getElementById('components-message-demo-info'));
+, mountNode);
 ````

components/message/demo/loading.md

@@ -16,5 +16,5 @@ const success = function() {
 };
 
 ReactDOM.render(<Button onClick={success}>显示加载中...</Button>
-, document.getElementById('components-message-demo-loading'));
+, mountNode);
 ````

components/message/demo/other.md

@@ -25,7 +25,7 @@ ReactDOM.render(<div>
   <Button onClick={success}>显示成功提示</Button>
   <Button onClick={error}>显示报错提示</Button>
   <Button onClick={warn}>显示警告提示</Button>
-</div>, document.getElementById('components-message-demo-other'));
+</div>, mountNode);
 ````
 
 <style>

components/modal/demo/async.md

@@ -53,5 +53,5 @@ const Test = React.createClass({
   }
 });
 
-ReactDOM.render(<Test/>, document.getElementById('components-modal-demo-async'));
+ReactDOM.render(<Test/>, mountNode);
 ````

components/modal/demo/basic.md

@@ -42,5 +42,5 @@ const App = React.createClass({
   }
 });
 
-ReactDOM.render(<App />, document.getElementById('components-modal-demo-basic'));
+ReactDOM.render(<App />, mountNode);
 ````

components/modal/demo/confirm-promise.md

@@ -26,5 +26,5 @@ function showConfirm(){
 ReactDOM.render(
 <Button onClick={showConfirm}>
   确认对话框
-</Button>, document.getElementById('components-modal-demo-confirm-promise'));
+</Button>, mountNode);
 ````

components/modal/demo/confirm.md

@@ -24,5 +24,5 @@ function showConfirm(){
 ReactDOM.render(
 <Button onClick={showConfirm}>
   确认对话框
-</Button>, document.getElementById('components-modal-demo-confirm'));
+</Button>, mountNode);
 ````

components/modal/demo/footer.md

@@ -54,5 +54,5 @@ const Test = React.createClass({
   }
 });
 
-ReactDOM.render(<Test/>, document.getElementById('components-modal-demo-footer'));
+ReactDOM.render(<Test/>, mountNode);
 ````

components/modal/demo/info.md

@@ -35,6 +35,6 @@ ReactDOM.render(<div>
   <Button onClick={info}>信息提示</Button>
   <Button onClick={success}>成功提示</Button>
   <Button onClick={error}>失败提示</Button>
-</div>, document.getElementById('components-modal-demo-info'));
+</div>, mountNode);
 ````
 

components/modal/demo/locale.md

@@ -55,6 +55,6 @@ ReactDOM.render(<div>
   <LocalizedModal />
   <br />
   <Button onClick={confirm}>confirm</Button>
-</div>, document.getElementById('components-modal-demo-locale'));
+</div>, mountNode);
 ````
 

components/notification/demo/basic.md

@@ -18,5 +18,5 @@ const openNotification = function() {
 
 ReactDOM.render(
   <Button type="primary" onClick={openNotification}>打开通知提醒框</Button>
-, document.getElementById('components-notification-demo-basic'));
+, mountNode);
 ````

components/notification/demo/duration.md

@@ -20,5 +20,5 @@ const openNotification = function() {
 
 ReactDOM.render(
   <Button type="primary" onClick={openNotification}>打开通知提醒框</Button>
-, document.getElementById('components-notification-demo-duration'));
+, mountNode);
 ````

components/notification/demo/onclose.md

@@ -26,5 +26,5 @@ ReactDOM.render(
   <div>
     <Button type="primary" onClick={openNotification}>打开通知提醒框</Button>
   </div>,
-document.getElementById('components-notification-demo-onclose'));
+mountNode);
 ````

components/notification/demo/with-btn.md

@@ -35,5 +35,5 @@ ReactDOM.render(
   <div>
     <Button type="primary" onClick={openNotification}>打开通知提醒框</Button>
   </div>,
-document.getElementById('components-notification-demo-with-btn'));
+mountNode);
 ````

components/notification/demo/with-icon.md

@@ -24,7 +24,7 @@ ReactDOM.render(<div>
   <Button onClick={openNotificationWithIcon('warn')}>警告</Button>
   <Button onClick={openNotificationWithIcon('error')}>错误</Button>
   </div>
-, document.getElementById('components-notification-demo-with-icon'));
+, mountNode);
 ````
 
 <style>

components/pagination/demo/basic.md

@@ -11,5 +11,5 @@ import { Pagination } from 'antd';
 
 ReactDOM.render(
   <Pagination defaultCurrent={1} total={50} />,
- document.getElementById('components-pagination-demo-basic'));
+ mountNode);
 ````

components/pagination/demo/changer.md

@@ -15,5 +15,5 @@ function onShowSizeChange(current, pageSize) {
 
 ReactDOM.render(
   <Pagination showSizeChanger onShowSizeChange={onShowSizeChange} defaultCurrent={3} total={500} />,
- document.getElementById('components-pagination-demo-changer'));
+ mountNode);
 ````