如何使用JavaScript从word文档页面中删除表格设计？Word js加载项

zpqajqem 于 2023-09-29 发布在 Java

关注(0)|答案(2)|浏览(149)

我在Word文档中插入一个表格设计的最后一页从表格的HTML。我怎么能删除它这是我的代码

async function NewMap() {
      try {
          await Word.run(async (context) => {  /*--html to word- https://stackoverflow.com/q/66576869  //-- word to html--- https://wordtohtml.net/   */
              var body = context.document.body;
              var paragraphs = body.paragraphs;
              context.load(paragraphs, 'length, last');
              await context.sync();

              const lastparagrsph = paragraphs.items[paragraphs.items.length - 1]
              // var selection = context.document.getSelection();
              var htmlContent = `<h4 style='margin-top:0in;margin-right:0in;margin-bottom:12.0pt;margin-left:0in;font-size:21px;font-family:"Calibri",sans-serif;color:black;'>Map Title</h4>
       <div style = 'margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;border:none;border-top:solid black 1.0pt;padding:0in 0in 0in 0in;margin-left:86.0pt;margin-right:0in;' >
       <p style='margin-top:12.0pt;margin-right:0in;margin-bottom:0in;margin-left:0in;text-align:right;text-indent:0in;border:none;padding:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-style:italic;'>&nbsp;</p>
        </div >
      <table style="width: 100%;border: none;border-collapse:collapse;">
      <tbody>
      <tr>
      <td style="width: 0.68%;padding: 0in 5.4pt;vertical-align: top;">
          <h5 style='margin:0in;font-size:15px;font-family:"Calibri",sans-serif;color:black;'>&nbsp;</h5>
      </td>
      <td style="width: 3.04%;padding: 0in 5.4pt;vertical-align: top;">
          <p style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;'>&nbsp;</p>
      </td>
      </tr>
     </tbody>
     </table>
     <p></p>
     <div style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;border:none;border-top:solid black 1.0pt;padding:0in 0in 0in 0in;margin-left:86.0pt;margin-right:0in;'>
     <p style='margin-top:12.0pt;margin-right:0in;margin-bottom:0in;margin-left:0in;text-align:right;text-indent:0in;border:none;padding:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-style:italic;'>&nbsp;</p>
     </div>
     <p><br></p>`;

              // selection.insertHtml(htmlContent, 'End');
              lastparagrsph.insertHtml(htmlContent, 'End');

              await context.sync();
          });

      } catch (error) {
          console.log(error);
      }

  };

我用来删除

async function DeleteMap() {
     try {
         await Word.run(async (context) => {
             var body = context.document.body;
             var paragraphs = body.paragraphs;
             context.load(paragraphs, 'length, last');
             await context.sync();

             const lastParagraph = paragraphs.items[paragraphs.items.length - 1];
             const range = lastParagraph.getRange();

             // Delete the range to remove the inserted HTML content
             range.delete();

             await context.sync();
         });
     } catch (error) {
         console.log(error);
     }
 }

这是删除，如果任何文本是在然后结束，但不删除我插入的html我想删除我插入的htmlContent。

JavaScript

来源：https://stackoverflow.com/questions/77170293/how-to-delete-table-design-from-word-document-page-using-javascript-word-js-ad

2条答案

按热度按时间

q5lcpyga1#

用这个我的问题就解决了

async function NewMap() {
    try {
        await Word.run(async (context) => {
            const body = context.document.body;

            // Insert the custom structure within a content control with a specific tag
            const contentControl = body.insertContentControl();
            contentControl.tag = "customTableControl";
            contentControl.insertHtml(
                `
                <h4 style='margin-top:0in;margin-right:0in;margin-bottom:12.0pt;margin-left:0in;font-size:21px;font-family:"Calibri",sans-serif;color:black;'>Map Title</h4>
                <div style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;border:none;border-top:solid black 1.0pt;padding:0in 0in 0in 0in;margin-left:86.0pt;margin-right:0in;'>
                    <p style='margin-top:12.0pt;margin-right:0in;margin-bottom:0in;margin-left:0in;text-align:right;text-indent:0in;border:none;padding:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-style:italic;'>&nbsp;</p>
                </div>
                <table style="width: 100%;border: none;border-collapse:collapse;">
                    <tbody>
                        <tr>
                            <td style="width: 0.68%;padding: 0in 5.4pt;vertical-align: top;">
                                <h5 style='margin:0in;font-size:15px;font-family:"Calibri",sans-serif;color:black;'>&nbsp;</h5>
                            </td>
                            <td style="width: 3.04%;padding: 0in 5.4pt;vertical-align: top;">
                                <p style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;'>&nbsp;</p>
                            </td>
                        </tr>
                    </tbody>
                </table>
                <div style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;border:none;border-top:solid black 1.0pt;padding:0in 0in 0in 0in;margin-left:86.0pt;margin-right:0in;'>
                    <p style='margin-top:12.0pt;margin-right:0in;margin-bottom:0in;margin-left:0in;text-align:right;text-indent:0in;border:none;padding:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-style:italic;'>&nbsp;</p>
                </div>
               <p style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;'>&nbsp;</p> `,
                Word.InsertLocation.replace
            );

            await context.sync();
        });

}catch (error) {
    console.log(error);
}

};

这是删除方法

async function DeleteMap() {
    try {
        await Word.run(async (context) => {
            const contentControlsWithTag = context.document.contentControls.getByTag('customTableControl');

            // Queue a command to load the content controls with the specified tag
            contentControlsWithTag.load('tag');

            // Synchronize the document state by executing the queued commands
            await context.sync();

            if (contentControlsWithTag.items.length === 0) {
                  console.log('No content control found.');
            } else {
                // Delete the content control
                contentControlsWithTag.items[0].delete();

                // Synchronize the document state by executing the queued command
                await context.sync();
                  console.log('Content control deleted.');
            }
        });
    } catch (error) {
        console.log(error);
    }
}

我添加内容控制上插入html然后删除它。

赞(0）回复(0）举报 2023-09-29

0dxa2lsx2#

在代码中，您插入了多个包含HTML内容的段落，包括表和其他元素。要删除它们，您应该识别并删除这些段落中的每一段。
使用Range对象的delete方法删除插入的HTML内容。检查这个link。

在要删除的HTML内容周围添加唯一标识符（例如，特定的HTML注解或占位符）。然后，您可以在最后一个段落中搜索该标识符，并相应地删除内容。

var htmlContent = `<h4 style='margin-top:0in;margin-right:0in;margin-bottom:12.0pt;margin-left:0in;font-size:21px;font-family:"Calibri",sans-serif;color:black;'>Map Title</h4>
<!-- StartMyCustomContent -->
<div style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;border:none;border-top:solid black 1.0pt;padding:0in 0in 0in 0in;margin-left:86.0pt;margin-right:0in;'>
   <p style='margin-top:12.0pt;margin-right:0in;margin-bottom:0in;margin-left:0in;text-align:right;text-indent:0in;border:none;padding:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-style:italic;'>&nbsp;</p>
</div>
<table style="width: 100%;border: none;border-collapse:collapse;">
   <!-- Some table content here -->
</table>
<p></p>
<div style='margin:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;border:none;border-top:solid black 1.0pt;padding:0in 0in 0in 0in;margin-left:86.0pt;margin-right:0in;'>
   <p style='margin-top:12.0pt;margin-right:0in;margin-bottom:0in;margin-left:0in;text-align:right;text-indent:0in;border:none;padding:0in;font-size:16px;font-family:"Calibri",sans-serif;color:black;font-style:italic;'>&nbsp;</p>
</div>
<p><br></p>
<!-- EndMyCustomContent -->`;

修改您的DeleteMap函数以搜索和删除自定义注解标记之间的内容。

async function DeleteMap() {
    try {
        await Word.run(async (context) => {
            var body = context.document.body;
            var paragraphs = body.paragraphs;
            context.load(paragraphs, 'length, last');
            await context.sync();

            const lastParagraph = paragraphs.items[paragraphs.items.length - 1];

            // Retrieve the HTML content as a string
            const paragraphHtml = lastParagraph.getHtml();

            // Find the custom comment tags
            const startTag = '<!-- StartMyCustomContent -->';
            const endTag = '<!-- EndMyCustomContent -->';

            // Check if the custom tags are present
            if (paragraphHtml.indexOf(startTag) !== -1 && paragraphHtml.indexOf(endTag) !== -1) {
                // Remove the content between the custom tags
                const startIndex = paragraphHtml.indexOf(startTag);
                const endIndex = paragraphHtml.indexOf(endTag) + endTag.length;
                const newHtmlContent = paragraphHtml.substring(0, startIndex) + paragraphHtml.substring(endIndex);
                lastParagraph.insertHtml(newHtmlContent, Word.InsertLocation.replace);
            }

            await context.sync();
        });
    } catch (error) {
        console.log(error);
    }
}

赞(0）回复(0）举报 2023-09-29

我来回答

如何使用JavaScript从word文档页面中删除表格设计？Word js加载项

2条答案

相关问题

热门标签

最新问答