[解決済み] TypeScript 。IFrameのサンドボックスプロパティが未定義、DOMSettableTokenListのコンストラクタがない
2022-02-19 23:12:14
質問
タイプスクリプトでiFrame要素を作成しています。
var iFrameElement : HTMLIFrameElement = document.createElement("iframe");
iFrameElement.sandbox.add('allow-forms');
iFrameElement.sandbox.add('allow-scripts');
iFrameElement.sandbox.add('allow-same-origin');
しかし、サンドボックスのプロパティは未定義なので、ここでのadd(value: string)は失敗します。
サンドボックスプロパティのインスタンス化の方法もわかりません。以下は lib.d.ts で定義されているインターフェースです。
interface HTMLIFrameElement {
sandbox: DOMSettableTokenList;
}
interface DOMSettableTokenList extends DOMTokenList {
value: string;
}
interface DOMTokenList {
length: number;
contains(token: string): boolean;
remove(token: string): void;
toggle(token: string): boolean;
add(token: string): void;
item(index: number): string;
[index: number]: string;
toString(): string;
}
私が知らない構文があるだけなのか、それとも何か他に動作させるためのコツがあるのかと思っています。このサイトやインターネット上で広範囲に検索してみましたが、結果は特に役に立ちませんでした。
答え こちら Type 'String' には 'DOMSettableTokenList' のプロパティ 'value' がない)そのため、何らかのオブジェクトをその型にキャストしたい。なるほど こいつ この型を再実装しているようですが、今の私にはあまりにハチャメチャに思えます。
スタックオーバーフローを助けてください、あなたが私の唯一の希望です。
どのように解決するのですか?
一般に、ブラウザ固有の実装を考えているのであれば、キャスト(型変更)して
any
というような書き方でも大丈夫です。
(<any>iFrameElement).foo = "";
... しかし、あなたのコードにいくつかのキャッチを作成します。
これでIEでも使えるようになります。
iFrameElement.sandbox.add('allow-forms');
iFrameElement.sandbox.add('allow-scripts');
そしてこれがChromeの場合。
(<any>iFrameElement).sandbox = "allow-forms allow-scripts";
関連
-
[解決済み】JavaScriptで':'(コロン)は何をするのか?
-
[解決済み】JavaScriptのisset()に相当するもの
-
[解決済み] React with ES7: Uncaught TypeError: Cannot read property 'state' of undefined [duplicate] (未定義のプロパティ'state'を読み込むことはできません。
-
[解決済み】コンソールがUnterminated JSX contentsエラーを投げる【終了しました
-
[解決済み] [Solved] Uncaught TypeError: nullのプロパティ 'appendChild' を読み取ることができない。
-
[解決済み】中央値の計算 - javascript
-
[解決済み] JavaScript でオブジェクトが特定のプロパティを持つかどうかを確認するにはどうすればよいですか?
-
[解決済み] TypeScript で `window` に新しいプロパティを明示的に設定するにはどうすればよいですか?
-
[解決済み】未定義のオブジェクトプロパティを検出する
-
[解決済み】プロパティ「...」にはイニシャライザがなく、コンストラクタで確実に代入されない
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】パッシブイベントリスナー内部でpreventDefaultができない
-
[解決済み】document.getElementByIDは関数ではありません。
-
[解決済み】JavaScriptのgetElementByNameが機能しない
-
[解決済み】JavaScriptのinnerHTMLで要素が更新されない
-
[解決済み】別のjsファイル内でJavaScriptの関数を呼び出す
-
[解決済み】React、Uncaught ReferenceError。ReactDOMは定義されていません
-
[解決済み】React.jsの配列の子要素のユニークキーを理解する
-
[解決済み】 Uncaught Reference Error: stLight is not defined (in Chrome only)
-
[解決済み】Syntax error: JavaScriptの不正なreturnステートメント
-
[解決済み] Uncaught (in promise) TypeError: フェッチに失敗してCorsエラー