TypeScript：將type屬性添加到HtmlElement

Question

我有以下TypeScript代碼：

let script: HTMLElement = document.createElement("script");
script.appendChild(document.createTextNode(`
  {
    "json": "property"
  }
`));
script.id = 'appContextModel';
document.body.appendChild(script);

我收到以下錯誤：

未捕獲到的SyntaxError：意外令牌：

我認為，因為當我嘗試將HTMLElement附加到正文時，腳本變量不具有值為application/json的屬性type ，因此編譯器正在檢索錯誤。

我正在尋找的是一種僅使用TypeScript將type="application/json"屬性添加到腳本元素的方法。

Answer 1

要將屬性添加到HTMLElment中，只需調用元素的setAttribute函數 ：

let script: HTMLElement = document.createElement("script");
script.appendChild(document.createTextNode(`
  {
    "json": "property"
  }
`));
script.id = 'appContextModel';
script.setAttribute('type', 'application/json');
document.body.appendChild(script);

或者，在這種情況下，只需設置屬性：

script.type = 'application/json';

請注意，將代碼直接寫入script元素時要考慮一些安全問題，尤其是在響應用戶輸入時。