如何使用 javascript Office api 插入 html 我的光标在 Word 加载项中的位置？

Question

使用这个我用 html 插入 2 列表格。使用“Word.InsertLocation.end”这是插入 html 以结束我想要在光标单击的位置在该位置插入 Html。

async function Insert2ColumnTable() {
    try {
        await Word.run(async (context) => {
            const range = context.document.getSelection();
            const contentControl = range.insertContentControl();
            contentControl.tag = "my-custom-tag";
            // Set the appearance of the content control to "Hidden"
            contentControl.appearance = Word.ContentControlAppearance.hidden;
            contentControl.insertHtml(
                ` <table style="width: 100%;border-collapse:collapse;border:none;">
                    <tbody>
                        <tr>
                             <td style="width: 50%;border-top: 1pt solid black;border-right: 1pt solid black;border-bottom: 1pt solid black;border-image: initial;border-left: 1pt solid black;padding: 0in 5.4pt;vertical-align: top;">
                                <p style='margin:0in;text-align:center;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-weight:bold;'>&nbsp;</p>
                            </td>
                            <td style="width: 50%;border-top: 1pt solid black;border-right: 1pt solid black;border-bottom: 1pt solid black;border-image: initial;1pt solid black;padding: 0in 5.4pt;vertical-align: top;">
                                <p style='margin:0in;text-align:center;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-weight:bold;'>&nbsp;</p>
                            </td>
                        </tr>
                    </tbody>
                </table>
                `,
                Word.InsertLocation.end
            );
            await context.sync();
        });
        
    } catch (error) {
        console.error(error);
    }

};

Answer 1

仅使用此“Word.InsertLocation.replace”即可工作。

async function Insert2ColumnTable() {
    try {
        await Word.run(async (context) => {
            const range = context.document.getSelection();
            const contentControl = range.insertContentControl();
            contentControl.tag = "my-custom-tag";
            // Set the appearance of the content control to "Hidden"
            contentControl.appearance = Word.ContentControlAppearance.hidden;
            contentControl.insertHtml(
                ` <table style="width: 100%;border-collapse:collapse;border:none;">
                    <tbody>
                        <tr>
                             <td style="width: 50%;border-top: 1pt solid black;border-right: 1pt solid black;border-bottom: 1pt solid black;border-image: initial;border-left: 1pt solid black;padding: 0in 5.4pt;vertical-align: top;">
                                <p style='margin:0in;text-align:center;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-weight:bold;'>&nbsp;</p>
                            </td>
                            <td style="width: 50%;border-top: 1pt solid black;border-right: 1pt solid black;border-bottom: 1pt solid black;border-image: initial;1pt solid black;padding: 0in 5.4pt;vertical-align: top;">
                                <p style='margin:0in;text-align:center;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-weight:bold;'>&nbsp;</p>
                            </td>
                        </tr>
                    </tbody>
                </table>
                `,
                Word.InsertLocation.replace
            );
            await context.sync();
        });
        
    } catch (error) {
        console.error(error);
    }

};