---
title: "insertContentAt 命令"
description: "使用 insertContentAt 命令在特定位置或范围添加内容，可以是纯文本、HTML 或 JSON。更多内容请见文档！"
canonical_url: "https://tiptap.zhcndoc.com/editor/api/commands/content/insert-content-at"
---

# insertContentAt 命令

使用 insertContentAt 命令在特定位置或范围添加内容，可以是纯文本、HTML 或 JSON。更多内容请见文档！

`insertContentAt` 将在给定位置或范围插入一个 HTML 字符串或节点。如果给定了范围，新内容将替换该范围内的内容。

## 参数

`position: number | Range`

内容将被插入的位置或范围。

`value: Content`

要插入的内容。可以是纯文本、HTML 字符串或 JSON 节点。

`options: Record<string, any>`

- updateSelection: 控制选择是否移动到新插入的内容。
- parseOptions: 传入的内容将由 ProseMirror 解析。要挂钩解析，您可以传递 `parseOptions`，它们将由 [ProseMirror](https://prosemirror.net/docs/ref/#model.ParseOptions) 处理。

## 使用 insertContentAt 命令

```js
// 纯文本
editor.commands.insertContentAt(12, '示例文本')

// 纯文本，替换范围
editor.commands.insertContentAt({ from: 12, to: 16 }, '示例文本')

// HTML
editor.commands.insertContentAt(12, '<h1>示例文本</h1>')

// 带修剪空格的 HTML
editor.commands.insertContentAt(12, '<p>你好，世界</p>', {
  updateSelection: true,
  parseOptions: {
    preserveWhitespace: 'full',
  },
})

// JSON/节点
editor.commands.insertContentAt(12, {
  type: 'heading',
  attrs: {
    level: 1,
  },
  content: [
    {
      type: 'text',
      text: '示例文本',
    },
  ],
})

// 同时插入多个节点
editor.commands.insertContentAt(12, [
  {
    type: 'paragraph',
    content: [
      {
        type: 'text',
        text: '第一段',
      },
    ],
  },
  {
    type: 'paragraph',
    content: [
      {
        type: 'text',
        text: '第二段',
      },
    ],
  },
])
```