复用模板生成演示文稿时，页面上往往留着上一版的内容：过期的标识、临时添加的装饰图形、不再需要的示意元素。逐页手工删除既费时，也容易漏掉；只想暂时隐藏、之后还要恢复的形状，删除后更难找回。

本文使用 Spire.Presentation for JavaScript 在浏览器中删除与隐藏 PowerPoint 形状。整个处理过程基于 WebAssembly，在用户设备本地完成，无需安装 Office，也不依赖后端服务。

本文介绍两个核心功能点：

• 删除 PowerPoint 形状
• 隐藏与显示 PowerPoint 形状

有关安装和项目配置，请参考 React 项目中集成 Spire.Presentation for JavaScript。以下示例默认 Spire.Presentation for JavaScript 已安装、WebAssembly 模块已初始化。

删除 PowerPoint 形状

删除幻灯片上的形状有两种常用方法：目标形状在集合中的索引确定时，可以直接按索引删除；索引不确定时，若形状带有可选文本，则遍历形状集合，按可选文本匹配后删除。

具体操作步骤如下：

1. 获取 Spire.Presentation 的 WASM 模块并确认已就绪，将字体文件与演示文稿载入 VFS。
2. 创建 Presentation 对象并调用 LoadFromFile() 加载演示文稿，再用 Slides.get_Item(0) 取得第一张幻灯片。
3. 用 Shapes.RemoveAt() 删除指定索引处的形状。
4. 从 Shapes.Count - 1 开始倒序遍历，用 Shapes.get_Item(i) 取得形状，判断 AlternativeText 是否包含标记，命中时调用 Shapes.Remove(shape) 删除。
5. 调用 Presentation.SaveToFile() 保存结果文件，并用 Dispose() 释放演示文稿。
6. 从 VFS 读出结果文件并触发浏览器下载。

删除 PowerPoint 形状的代码如下：

function App() {
  const removeShapes = async () => {
    // 获取 Spire.Presentation WASM 模块
    const pptModule = window.wasmModule?.spirepresentation;

    // 检查模块是否就绪
    if (!pptModule) {
      alert('Spire.Presentation is not ready yet');
      return;
    }

    // 将字体与演示文稿载入 VFS
    await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
    const inputFileName = 'Shapes.pptx';
    await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);

    // 加载演示文稿并取得第一张幻灯片
    const ppt = new pptModule.Presentation();
    ppt.LoadFromFile(inputFileName);
    const slide = ppt.Slides.get_Item(0);

    // 按索引删除第 2 个形状（索引从 0 开始）
    slide.Shapes.RemoveAt(1);

    // 按可选文本删除标记为“装饰”的形状
    for (let i = slide.Shapes.Count - 1; i >= 0; i--) {
      const shape = slide.Shapes.get_Item(i);
      if (shape.AlternativeText.includes('装饰')) {
        slide.Shapes.Remove(shape);
      }
    }

    // 保存结果文件
    const outputFileName = 'RemoveShapes.pptx';
    ppt.SaveToFile({ file: outputFileName, fileFormat: pptModule.FileFormat.Pptx2013 });
    ppt.Dispose();

    // 从 VFS 读取生成的文件，触发下载
    const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
    const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = outputFileName;
    a.click();
    URL.revokeObjectURL(url);
  };

  return (
    <div style={{ textAlign: 'center', height: '300px' }}>
      <h1>删除形状</h1>
      <button onClick={removeShapes}>
        删除形状
      </button>
    </div>
  );
}

export default App;

按索引与可选文本删除形状后的演示文稿：

隐藏与显示 PowerPoint 形状

有些形状只是暂时不需要出现在当前版本里，删掉反而不便恢复。此时可以保留形状、只隐藏其显示：把形状的 IsHidden 设为 true，形状仍留在文件中，之后再设为 false 即可恢复。隐藏与删除的区别在于，前者保留了形状本身及其样式。

具体操作步骤如下：

1. 获取 Spire.Presentation 的 WASM 模块并确认已就绪，将字体文件与演示文稿载入 VFS。
2. 创建 Presentation 对象并调用 LoadFromFile() 加载演示文稿，再用 Slides.get_Item(0) 取得第一张幻灯片。
3. 用 Shapes.get_Item() 按索引取得要隐藏的形状，把 IsHidden 设为 true。
4. 调用 Presentation.SaveToFile() 保存结果文件，并用 Dispose() 释放演示文稿，随后从 VFS 读出文件并触发下载。

隐藏形状的代码如下：

function App() {
  const hideShapes = async () => {
    // 获取 Spire.Presentation WASM 模块
    const pptModule = window.wasmModule?.spirepresentation;

    // 检查模块是否就绪
    if (!pptModule) {
      alert('Spire.Presentation is not ready yet');
      return;
    }

    // 将字体与演示文稿载入 VFS
    await window.spire.FetchFileToVFS('simsun.ttc', '/Library/Fonts/', `${process.env.PUBLIC_URL}/font/`);
    const inputFileName = 'Shapes.pptx';
    await window.spire.FetchFileToVFS(inputFileName, '', `${process.env.PUBLIC_URL}data/`);

    // 加载演示文稿并取得第一张幻灯片
    const ppt = new pptModule.Presentation();
    ppt.LoadFromFile(inputFileName);
    const slide = ppt.Slides.get_Item(0);

    // 取得索引为 1 的形状（即第 2 个形状）并隐藏
    const shape = slide.Shapes.get_Item(1);
    shape.IsHidden = true;

    // 保存结果文件
    const outputFileName = 'HideShapes.pptx';
    ppt.SaveToFile({ file: outputFileName, fileFormat: pptModule.FileFormat.Pptx2013 });
    ppt.Dispose();

    // 从 VFS 读取生成的文件，触发下载
    const fileArray = window.dotnetRuntime.Module.FS.readFile(outputFileName);
    const blob = new Blob([fileArray], { type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = outputFileName;
    a.click();
    URL.revokeObjectURL(url);
  };

  return (
    <div style={{ textAlign: 'center', height: '300px' }}>
      <h1>隐藏形状</h1>
      <button onClick={hideShapes}>
        隐藏形状
      </button>
    </div>
  );
}

export default App;

隐藏指定形状后的演示文稿：

要恢复显示，对同一个形状把 IsHidden 设为 false 即可，形状的内容与样式不会丢失：

shape.IsHidden = false;

常见问题

隐藏形状与删除形状有什么区别

原因：两者对文件的影响不同。

解决：Shapes.Remove() / Shapes.RemoveAt() 会把形状从幻灯片上移除，之后无法通过集合找回；IsHidden = true 只改变显示状态，形状及其样式仍保留在文件中，随时可以设回 false 恢复。

如何删除幻灯片上的全部形状

原因：需要清空页面时，逐个按索引删除会因索引前移而漏删。

解决：同样从后往前遍历，不判断条件直接删除：

for (let i = slide.Shapes.Count - 1; i >= 0; i--) {
  slide.Shapes.RemoveAt(i);
}

隐藏后的形状还能读取吗

原因：隐藏只改变显示状态，形状对象仍属于幻灯片的形状集合。

解决：遍历 Shapes 时仍能取得该形状，可通过 shape.IsHidden 判断它是否处于隐藏状态，再决定显示或跳过。

获取免费许可证

如果您希望删除结果文档中的评估消息，或者摆脱功能限制，请该Email地址已收到反垃圾邮件插件保护。要显示它您需要在浏览器中启用JavaScript。获取有效期 30 天的临时许可证。