# 内容设置
直接在目标容器中添加 HTML 代码即可渲染设置内容。
## 通过 html 设置[在线预览](http://jsbin.com/mimunon)
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>xeditor</title>
<script src="https://unpkg.com/xeditor"></script>
</head>
<body>
<div id="xe" class="xe">
<p>
<span>这是</span>
<i>倾斜</i>
<strong>加粗</strong>
<span>的内容。</span>
</p>
</div>
<script>
var myEditor = new window.xEditor('#xe')
myEditor.create();
</script>
</body>
</html>
```
## 通过 JS 设置[在线预览](http://output.jsbin.com/valasac)
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>xeditor</title>
<script src="https://unpkg.com/xeditor"></script>
</head>
<body>
<div id="xe" class="xe"></div>
<script>
var myEditor = new window.xEditor('#xe')
myEditor.create();
// 设置内容
myEditor.setHtml('<p><span>这是</span><strong>js</strong><span>的内容。</span></p>')
</script>
</body>
</html>
```
## 在内容区追加内容[在线预览](http://output.jsbin.com/rutuxim)
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>xeditor</title>
<script src="https://unpkg.com/xeditor"></script>
</head>
<body>
<div id="xe" class="xe"></div>
<script>
var myEditor = new window.xEditor('#xe')
myEditor.create();
// 追加内容
myEditor.setInsertHtml('<p>追加的内容。</p>')
</script>
</body>
</html>
```
