# Content and Files

This page shows how to read and write `MDEditor` content: initializing, getting the text, clearing, opening Markdown files, exporting, and the save callback.

## Methods

| Method | Description |
|---|---|
| `init(text?, withFocus = true, set = true)` | Rebuilds all rows from `text` (or the not-yet-used `defaultContent`); when `set` is truthy an undo entry is recorded |
| `text` | Read-only property returning the rows' `innerText` joined with `\n` |
| `clear()` | Calls `init()` to empty the editor and updates the preview |
| `selectAll()` | Selects all text from the first row to the last |
| `openfile(file)` | Reads a `File` with `FileReader`, loads it, then updates the preview; without an argument it shows `alert("請選擇檔案")` |
| `download(type = "md")` | Exports a file; `type` is `"md"` or `"html"`, anything else is ignored |
| `save()` | Runs the save flow described below |
| `unsave()` | Sets `data-saved` to `0` on the editor and the bound viewer |
| `changeMode(mode = "light")` | Switches the theme; see [Theming](/theming) |

`init()` clears the container's `innerHTML` before rebuilding, recreating the toolbar as well. Called directly it does not update the preview; follow it with `editor.viewer.init()` when needed.

## Opening a File

```html
<input type="file" accept=".md" onchange="editor.openfile(this.files[0])">
```

The text read in is trimmed, and plain and non-breaking spaces are normalized to plain spaces. `openfile()` calls `clear()` first, so the previous content stays in the undo history.

## Exporting

| `type` | File name | Content |
|---|---|---|
| `"md"` | `NanoMD-<timestamp>.md` | `editor.text.trim()` |
| `"html"` | `NanoMD-<timestamp>.html` | A full HTML document: `<section class="pd-md-viewer">` wrapping the extended-mode conversion, referencing `NanoMD-output.css` on the CDN (pinned to 1.11.6), Material Symbols and code-prettify |

The exported HTML does not load Mermaid, so Mermaid blocks appear as source text. The file is downloaded as an `application/octet-stream` Blob.

## Save Flow

`save()` (also bound to `Cmd/Ctrl+S`) behaves according to `autosave` and `event.save`:

| `autosave` | `event.save` | Behavior |
|---|---|---|
| Truthy | A function | Calls `event.save(editor.text)` |
| Truthy | Not set | Opens the export dialog (Markdown / HTML / Cancel) |
| False | A function | Updates the preview, then calls `event.save(editor.text)` |
| False | Not set | Only updates the preview |
| Either | Explicitly `null` | Returns `false` and does nothing else (with `autosave` false the preview is still updated first) |

```javascript
const editor = new MDEditor({
    id: "editor",
    event: {
        save: (text) => fetch("/api/save", { method: "POST", body: text })
    }
});
```
