Übung – Einfügen und Ersetzen von Bildern, HTML und Tabellen

Abgeschlossen

In dieser Übung fügen Sie Text innerhalb und außerhalb ausgewählter Textbereiche hinzu und ersetzen den Text eines ausgewählten Bereichs. Sie erfahren auch, wie Sie Bilder, HTML-Code und Tabellen in das Dokument einfügen können.

Wichtig

In dieser Übung wird davon ausgegangen, dass Sie das Word-Add-In in der vorherigen Übung in diesem Modul erstellt haben.

Hinzufügen von Text in einem Bereich

  1. Öffnen Sie die Datei ./src/taskpane/taskpane.html.

  2. Suchen Sie das <button>-Element für die Schaltfläche change-font, und fügen Sie nach dieser Zeile das folgende Markup hinzu:

    <button class="ms-Button" id="insert-text-into-range">Insert Abbreviation</button><br/><br/>
    
  3. Öffnen Sie die Datei ./src/taskpane/taskpane.js.

  4. Suchen Sie in der Office.onReady()-Methodenaufruf in der Office.onReady()-Methode die folgende Zeile:

    document.getElementById("change-font").onclick = changeFont;
    

    Fügen Sie unmittelbar nach der Zeile den folgenden Code hinzu:

    document.getElementById("insert-text-into-range").onclick = insertTextIntoRange;
    
  5. Fügen Sie die folgende Funktion am Ende der Datei hinzu:

    async function insertTextIntoRange() {
      await Word.run(async (context) => {
        // TODO1: Queue commands to insert text into a selected range.
    
        // TODO2: Load the text of the range and sync so that the
        //        current range text can be read.
    
        // TODO3: Queue commands to repeat the text of the original
        //        range at the end of the document.
    
        await context.sync();
      })
      .catch(function (error) {
        console.log("Error: " + error);
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
    }
    
  6. Ersetzen Sie in der insertTextIntoRange()-Funktion TODO1 durch den folgenden Code:

    const doc = context.document;
    const originalRange = doc.getSelection();
    originalRange.insertText(" (C2R)", "End");
    

    Hinweis

    • Die Methode dient zum Einfügen der Abkürzung ["(C2R)"]am Ende des Bereichs, dessen Text "Click-to-Run" lautet. Vereinfachend wird davon ausgegangen, dass die Zeichenfolge vorhanden ist und der Benutzer sie ausgewählt hat.
    • Der erste Parameter der Range.insertText-Methode ist die Zeichenfolge, die in das Range-Objekt eingefügt werden soll.
    • Der zweite Parameter gibt an, wo im Bereich der zusätzliche Text eingefügt werden soll. Neben "End" lauten die anderen möglichen Optionen: "Start", "Before", "After" und "Replace".
    • Der Unterschied zwischen "End" und "After" ist, dass "End" den neuen Text am Ende des vorhandenen Bereichs einfügt, während "After" einen neuen Bereich mit der Zeichenfolge erstellt und den neuen Bereich nach dem vorhandenen Bereich einfügt. Ebenso fügt "Start" Text am Anfang des vorhandenen Bereichs ein, während "Vor" einen neuen Bereich einfügt. "Replace" ersetzt den Text des vorhandenen Bereichs durch die Zeichenfolge im ersten Parameter.
    • Sie haben in einer früheren Phase des Lernprogramms gesehen, dass die „insert*“-Methoden des Textobjekts nicht über die Optionen "Before" oder "After" verfügen. Dies liegt daran, dass Sie Inhalte nicht außerhalb des Texts des Dokuments einfügen können.
  7. Wir überspringen TODO2 bis zum nächsten Abschnitt.

    Ersetzen Sie in der insertTextIntoRange()-Funktion TODO3 durch den folgenden Code. Dieser Code ähnelt dem Code, den Sie in der ersten Phase des Lernprogramms erstellt haben, mit dem Unterschied, dass Sie jetzt einen neuen Absatz am Ende des Dokuments statt zu Beginn einfügen. Dieser neue Absatz zeigt, dass der neue Text jetzt Teil des ursprünglichen Bereichs ist.

    doc.body.insertParagraph("Original range: " + originalRange.text, "End");
    

Hinzufügen von Code zum Abrufen von Dokumenteigenschaften in die Skriptobjekte des Aufgabenbereichs

In allen früheren Funktionen in diesem Modul wurden Befehle zum Schreiben in das Office-Dokument in die Warteschlange eingereiht. Jede Funktion endete mit einem Aufruf der context.sync()-Methode, die die Befehle in der Warteschlange zur Ausführung an das Dokument sendet.

Der Code, den Sie im letzten Schritt hinzugefügt haben, ruft die originalRange.text-Eigenschaft auf. Dies ist ein wesentlicher Unterschied zu den früheren Funktionen, die Sie geschrieben haben, da das originalRange-Objekt nur ein Proxyobjekt ist, das im Skript Ihres Aufgabenbereichs vorhanden ist. Ihm ist der eigentliche Text des Bereichs im Dokument nicht bekannt, sodass die text-Eigenschaft keinen echten Wert haben kann.

Es ist erforderlich, um zuerst den Textwert des Bereichs aus dem Dokument abzurufen und damit den Wert von originalRange.text festzulegen. Nur dann kann originalRange.text aufgerufen werden, ohne dass eine Ausnahme ausgelöst wird.

Der Prozess des Abrufens besteht aus drei Schritten:

  1. Einen Befehl zum Laden der Eigenschaften, die Ihr Code lesen muss, in der Warteschlange einreihen (d.h. abrufen).
  2. Aufrufen der sync()-Methode des Kontextobjekts, um den Befehl in der Warteschlange zur Ausführung an das Dokument zu senden und die angeforderten Informationen zurückzugeben.
  3. Da die sync()-Methode asynchron ist, müssen Sie sicherstellen, dass sie abgeschlossen ist, bevor Ihr Code die Eigenschaften aufruft, die abgerufen wurden.

Diese Schritte müssen immer dann abgeschlossen werden, wenn Ihr Code Informationen aus dem Office-Dokument lesen muss.

  1. Ersetzen Sie in der insertTextIntoRange()-Funktion TODO2 durch den folgenden Code.

    originalRange.load("text");
    await context.sync();
    
    // TODO4: Move the doc.body.insertParagraph line here.
    
    // TODO5: Move the final call of context.sync here and ensure
    //        that it doesn't run until the insertParagraph has
    //        been queued.
    
  2. Verschieben Sie die Zeile doc.body.insertParagraph und fügen Sie sie anstelle von TODO4 ein.

Wenn Sie fertig sind, sollte die vollendete insertTextIntoRange()-Funktion wie folgt aussehen:

async function insertTextIntoRange() {
  await Word.run(async (context) => {
    const doc = context.document;
    const originalRange = doc.getSelection();
    originalRange.insertText(" (C2R)", "End");

    originalRange.load("text");
    await context.sync();

    doc.body.insertParagraph("Current text of original range: " + originalRange.text, "End");

    await context.sync();
  })
  .catch(function (error) {
    console.log("Error: " + error);
    if (error instanceof OfficeExtension.Error) {
      console.log("Debug info: " + JSON.stringify(error.debugInfo));
    }
  });
}

Hinzufügen von Text zwischen Bereichen

  1. Öffnen Sie die Datei ./src/taskpane/taskpane.html.

  2. Suchen Sie das <button>-Element für die Schaltfläche insert-text-into-range, und fügen Sie nach dieser Zeile das folgende Markup hinzu:

    <button class="ms-Button" id="insert-text-outside-range">Add Version Info</button><br/><br/>
    
  3. Öffnen Sie die Datei ./src/taskpane/taskpane.js.

  4. Suchen Sie in der Office.onReady()-Methodenaufruf in der Office.onReady()-Methode die folgende Zeile:

    document.getElementById("insert-text-into-range").onclick = insertTextIntoRange;
    

    Fügen Sie unmittelbar nach der Zeile den folgenden Code hinzu:

    document.getElementById("insert-text-outside-range").onclick = insertTextBeforeRange;
    
  5. Fügen Sie die folgende Funktion am Ende der Datei hinzu:

    async function insertTextBeforeRange() {
      await Word.run(async (context) => {
        // TODO1: Queue commands to insert a new range before the
        //        selected range.
    
        // TODO2: Load the text of the original range and sync so that the
        //        range text can be read and inserted.
      })
      .catch(function (error) {
        console.log("Error: " + error);
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
    }
    
  6. Ersetzen Sie in der insertTextBeforeRange()-Funktion TODO1 durch den folgenden Code:

    const doc = context.document;
    const originalRange = doc.getSelection();
    originalRange.insertText("Office 2019, ", "Before");
    

    Hinweis

    • Die -Methode soll einen Bereich mit dem Text "Office 2019, " vor dem Bereich mit dem Text "Microsoft 365" hinzufügen. Vereinfachend wird davon ausgegangen, dass die Zeichenfolge vorhanden ist und der Benutzer sie ausgewählt hat.
    • Der erste Parameter der Range.insertText()-Methode ist die Zeichenfolge, die hinzugefügt werden soll.
    • Der zweite Parameter gibt an, wo im Bereich der zusätzliche Text eingefügt werden soll. Weitere Informationen zu den Positionsoptionen finden Sie in der vorherigen Erläuterung der insertTextIntoRange()-Funktion.
  7. Ersetzen Sie in der insertTextBeforeRange()-Funktion TODO2 durch den folgenden Code.

    originalRange.load("text");
    await context.sync();
    
    // TODO3: Queue commands to insert the original range as a
    //        paragraph at the end of the document.
    
    // TODO4: Make a final call of context.sync here and ensure
    //        that it doesn't run until the insertParagraph has
    //        been queued.
    
  8. Ersetzen Sie TODO3 durch den folgenden Code. Dieser neue Absatz veranschaulicht die Tatsache, dass der neue Text nicht Teil des ursprünglich ausgewählten Bereichs ist. Der ursprüngliche Bereich enthält weiterhin nur den Text, den er enthielt, als er ausgewählt wurde.

    doc.body.insertParagraph("Current text of original range: " + originalRange.text, "End");
    
  9. Ersetzen Sie TODO4 durch den folgenden Code:

    await context.sync();
    

Ersetzen des Texts eines Bereichs

  1. Öffnen Sie die Datei ./src/taskpane/taskpane.html.

  2. Suchen Sie das <button>-Element für die Schaltfläche insert-text-outside-range, und fügen Sie nach dieser Zeile das folgende Markup hinzu:

    <button class="ms-Button" id="replace-text">Change Quantity Term</button><br/><br/>
    
  3. Öffnen Sie die Datei ./src/taskpane/taskpane.js.

  4. Suchen Sie in der Office.onReady()-Methodenaufruf in der Office.onReady()-Methode die folgende Zeile:

    document.getElementById("insert-text-outside-range").onclick = insertTextBeforeRange;
    

    Fügen Sie unmittelbar nach der Zeile den folgenden Code hinzu:

    document.getElementById("replace-text").onclick = replaceText;
    
  5. Fügen Sie die folgende Funktion am Ende der Datei hinzu:

    async function replaceText() {
      await Word.run(async (context) => {
        // TODO1: Queue commands to replace the text.
    
        await context.sync();
      })
      .catch(function (error) {
        console.log("Error: " + error);
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
    }
    
  6. Ersetzen Sie in der replaceText()-Funktion TODO1 durch den folgenden Code. Die Methode ist vorgesehen, um die Zeichenfolge "several" durch die Zeichenfolge "many" zu ersetzen. Vereinfachend wird davon ausgegangen, dass die Zeichenfolge vorhanden ist und der Benutzer sie ausgewählt hat.

    const doc = context.document;
    const originalRange = doc.getSelection();
    originalRange.insertText("many", "Replace");
    
  7. Vergewissern Sie sich, dass Sie alle am Projekt vorgenommen Änderungen gespeichert haben.

Testen des Add-Ins

  1. Wiederholen Sie die Schritte aus der vorherigen Übung, um das Add-In quer zu laden.
  2. Wenn der Add-In-Aufgabenbereich noch nicht in Word geöffnet ist, wechseln Sie zur Registerkarte Start , und wählen Sie im Menüband die Schaltfläche Aufgabenbereich anzeigen aus, um ihn zu öffnen.
  3. Wählen Sie im Aufgabenbereich die Schaltfläche Absatz einfügen aus, um sicherzustellen, dass sich ein Absatzes am Anfang des Dokuments befindet.
  4. Wählen Sie im Dokument den Ausdruck „Klick-und-Los“ aus. Achten Sie darauf, nicht das vorhergehende Leerzeichen oder nachfolgende Komma in die Markierung einzuschließen.
  5. Wählen Sie die Schaltfläche Abkürzung einfügen aus. Beachten Sie, dass "(C2R)" hinzugefügt wird. Beachten Sie außerdem, dass am Ende des Dokuments ein neuer Absatz mit dem gesamten erweiterten Text hinzugefügt wird, da die neue Zeichenfolge zum vorhandenen Bereich hinzugefügt wurde.
  6. Wählen Sie im Dokument den Ausdruck „Microsoft 365“ aus. Achten Sie darauf, nicht das vorhergehende oder nachfolgende Leerzeichen in die Markierung einzuschließen.
  7. Wählen Sie die Schaltfläche Versionsinformationen hinzufügen aus. Beachten Sie, dass "Office 2019" zwischen "Office 2016" und "Microsoft 365" eingefügt wird. Beachten Sie außerdem, dass am Ende des Dokuments ein neuer Absatz hinzugefügt wird, der aber nur den ursprünglich ausgewählten Text enthält, da die neue Zeichenfolge nicht dem ursprünglichen Bereich hinzugefügt wurde, sondern zu einem neuen Bereich wurde.
  8. Wählen Sie im Dokument den Ausdruck „Mehrere“ aus. Achten Sie darauf, nicht das vorhergehende oder nachfolgende Leerzeichen in die Markierung einzuschließen.
  9. Wählen Sie die Schaltfläche Quantity Term ändern aus. Beachten Sie, dass "many" den markierten Text ersetzt.

Screenshot eines Texts, der in Word hinzugefügt und durch ein Lernprogramm ersetzt wurde.

Einfügen von Bildern, HTML-Code und Tabellen

In diesem Schritt des Lernprogramms erfahren Sie, wie Sie Bilder, Tabellen und HTML-Code in das Dokument einfügen können.

Definieren eines Bilds

Führen Sie die folgenden Schritte aus, um das Bild zu definieren, das Sie in das Dokument im nächsten Teil dieses Lernprogramms einfügen möchten.

  1. Erstellen Sie im Stamm des Projekts eine neue Datei namens ./src/taskpane/base64Image.js.

  2. Öffnen Sie die Datei bae64Image.js und fügen Sie den folgenden Code hinzu, um die Base64-codierte Zeichenfolge anzugeben, die ein Bild darstellt.

    export const base64Image =
        "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";
    

Einfügen eines Bilds

  1. Öffnen Sie die Datei ./src/taskpane/taskpane.html.

  2. Suchen Sie das <button>-Element für die Schaltfläche replace-text, und fügen Sie nach dieser Zeile das folgende Markup hinzu:

    <button class="ms-Button" id="insert-image">Insert Image</button><br/><br/>
    
  3. Öffnen Sie die Datei ./src/taskpane/taskpane.js.

  4. Suchen Sie den Office.onReady()-Methodenaufruf oben in der Datei und fügen Sie den folgenden Code unmittelbar nach dieser Zeile hinzu. Mit diesem Code wird die zuvor in der Datei base64Image.js definierte Variable importiert.

    import { base64Image } from "./base64Image";
    
  5. Suchen Sie in der Office.onReady()-Methodenaufruf in der Office.onReady()-Methode die folgende Zeile:

    document.getElementById("replace-text").onclick = replaceText;
    

    Fügen Sie unmittelbar nach der Zeile den folgenden Code hinzu:

    document.getElementById("insert-image").onclick = insertImage;
    
  6. Fügen Sie die folgende Funktion am Ende der Datei hinzu:

    async function insertImage() {
      await Word.run(async (context) => {
        // TODO1: Queue commands to insert an image.
    
        await context.sync();
      })
      .catch(function (error) {
        console.log("Error: " + error);
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
    }
    
  7. Ersetzen Sie in der insertImage()-Funktion TODO1 durch den folgenden Code. Mit dieser Zeile wird das Base64-codierte Bild am Ende des Dokuments eingefügt. (Das Paragraph -Objekt verfügt auch über eine insertInlinePictureFromBase64() -Methode und andere insert* Methoden. Ein Beispiel finden Sie im folgenden Abschnitt insertHTML.)

    context.document.body.insertInlinePictureFromBase64(base64Image, "End");
    

HTML einfügen

  1. Öffnen Sie die Datei ./src/taskpane/taskpane.html.

  2. Suchen Sie das <button>-Element für die Schaltfläche insert-image, und fügen Sie nach dieser Zeile das folgende Markup hinzu:

    <button class="ms-Button" id="insert-html">Insert HTML</button><br/><br/>
    
  3. Öffnen Sie die Datei ./src/taskpane/taskpane.js.

  4. Suchen Sie in der Office.onReady()-Methodenaufruf in der Office.onReady()-Methode die folgende Zeile:

    document.getElementById("insert-image").onclick = insertImage;
    

    Fügen Sie unmittelbar nach der Zeile den folgenden Code hinzu:

    document.getElementById("insert-html").onclick = insertHTML;
    
  5. Fügen Sie die folgende Funktion am Ende der Datei hinzu:

    async function insertHTML() {
      await Word.run(async (context) => {
        // TODO1: Queue commands to insert a string of HTML.
    
        await context.sync();
      })
      .catch(function (error) {
        console.log("Error: " + error);
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
    }
    
  6. Ersetzen Sie in der insertHTML()-Funktion TODO1 durch den folgenden Code:

    const blankParagraph = context.document.body.paragraphs.getLast().insertParagraph("", "After");
    blankParagraph.insertHtml('<p style="font-family: verdana;">Inserted HTML.</p><p>Another paragraph</p>', "End");
    

    Hinweis

    • Die erste Zeile Fügt einen leeren Absatz am Ende des Dokuments hinzu.
    • Die zweite Zeile fügt am Ende des Absatzes eine HTML-Zeichenfolge ein; genau genommen zwei Absätze, einen mit der Formatierung in der Schriftart Verdana, den anderen mit der Standardformatvorlage des Word-Dokuments. (Wie Sie in der insertImage()-Methode gesehen haben, hat das context.document.body-Objekt auch die insert*-Methoden.)

Einfügen einer Tabelle

  1. Öffnen Sie die Datei ./src/taskpane/taskpane.html.

  2. Suchen Sie das <button>-Element für die Schaltfläche insert-html, und fügen Sie nach dieser Zeile das folgende Markup hinzu:

    <button class="ms-Button" id="insert-table">Insert Table</button><br/><br/>
    
  3. Öffnen Sie die Datei ./src/taskpane/taskpane.js.

  4. Suchen Sie in der Office.onReady()-Methodenaufruf in der Office.onReady()-Methode die folgende Zeile:

    document.getElementById("insert-html").onclick = insertHTML;
    

    Fügen Sie unmittelbar nach der Zeile den folgenden Code hinzu:

    document.getElementById("insert-table").onclick = insertTable;
    
  5. Fügen Sie die folgende Funktion am Ende der Datei hinzu:

    async function insertTable() {
      await Word.run(async (context) => {
        // TODO1: Queue commands to get a reference to the paragraph
        //        that will proceed the table.
    
        // TODO2: Queue commands to create a table and populate it with data.
    
        await context.sync();
      })
      .catch(function (error) {
        console.log("Error: " + error);
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
    }
    
  6. Ersetzen Sie in der insertTable()-Funktion TODO1 durch den folgenden Code. Diese Zeile verwendet die ParagraphCollection.getFirst() -Methode, um einen Verweis auf den ersten Absatz abzurufen, und verwendet dann die Paragraph.getNext() -Methode, um einen Verweis auf den zweiten Absatz abzurufen.

    const secondParagraph = context.document.body.paragraphs.getFirst().getNext();
    
  7. Ersetzen Sie in der insertTable()-Funktion TODO2 durch den folgenden Code:

    const tableData = [
        ["Name", "ID", "Birth City"],
        ["Bob", "434", "Chicago"],
        ["Sue", "719", "Havana"],
    ];
    secondParagraph.insertTable(3, 3, "After", tableData);
    

    Hinweis

    • Die ersten beiden Parameter der insertTable()-Methode geben die Anzahl der Zeilen und Spalten an.
    • Der dritte Parameter gibt an, wo die Tabelle eingefügt werden soll, in diesem Fall nach dem Absatz.
    • Der vierte Parameter ist ein zweidimensionales Array, das die Werte der Tabellenzellen festlegt.
    • Die Tabelle hat die einfache Standardformatierung, aber die insertTable()-Methode gibt ein Table-Objekt mit vielen Elementen zurück, von denen einige zum Formatieren der Tabelle verwendet werden.
  8. Vergewissern Sie sich, dass Sie alle am Projekt vorgenommen Änderungen gespeichert haben.

Testen des Add-Ins

  1. Wiederholen Sie die Schritte aus der vorherigen Übung, um das Add-In quer zu laden.
  2. Wenn der Add-In-Aufgabenbereich noch nicht in Word geöffnet ist, wechseln Sie zur Registerkarte Start , und wählen Sie im Menüband die Schaltfläche Aufgabenbereich anzeigen aus, um ihn zu öffnen.
  3. Wählen Sie im Aufgabenbereich mindestens dreimal die Schaltfläche Absatz einfügen aus, um sicherzustellen, dass es ein paar Absätze im Dokument gibt.
  4. Wählen Sie die Schaltfläche Bild einfügen aus, und beachten Sie, dass ein Bild am Ende des Dokuments eingefügt wird.
  5. Wählen Sie die Schaltfläche HTML einfügen aus, und beachten Sie, dass zwei Absätze am Ende des Dokuments eingefügt werden, von denen der erste die Schriftart Verdana hat.
  6. Wählen Sie die Schaltfläche Tabelle einfügen aus, und beachten Sie, dass eine Tabelle nach dem zweiten Absatz eingefügt wird.

Screenshot eines Bilds, eines HTML-Codes und einer Tabelle, die von einem Lernprogramm in Word eingefügt wurden.

Zusammenfassung

In dieser Übung haben Sie das Add-In aktualisiert, das Sie in einer vorherigen Übung erstellt haben, um Bilder, HTML-Code und Tabellen zu einem Word-Dokument hinzuzufügen. Sie haben auch erfahren, wie Sie Bilder, HTML-Code und Tabellen in das Dokument einfügen können.

Testen Sie Ihr Wissen

1.

Welche der folgenden Optionen gibt den ausgewählten Textbereich im aktuellen Dokument zurück?

2.

Welche der folgenden Optionen fügt ein neues Bild aus einer Basis-64-Zeichenfolge am Ende eines Word-Dokuments ein?