キャッチされていないReferenceError：要素属性の代入で左辺が無効です

Question

私はダッシュでビデオプレーヤーを作成しています。ビデオコンテナ要素内に<video>要素を作成するための関数にデータ属性を追加しようとすると、「Uncaught ReferenceError：要素属性の代入に無効な左辺がある」というエラーが表示されるようです。それは私の "データ・ビデオ-ID" を好きではないので、

videoElement.data-video-id = window.datavideoId; 

OK - ：

function createVideoElement() { 
     videoElement = document.createElement("video"); 
     videoElement.id = "video"; 
     videoContainer = document.getElementById("video-container"); 
     videoElement.autoplay = false; 
     videoElement.src = ""; 
     videoElement.controls = true; 
     videoElement.data-video-id = window.datavideoId; 
     videoContainer.appendChild(videoElement); 
     window.addEventListener('popstate', onBackNav); 
     return videoElement; 
    } 

エラーがで発生します。 data-video-id行を削除すると、<video>要素が適切な属性で作成されます。このエラーが出ることなく、どうすればこのことができますか？

Answer 1

マイナス（減算）演算子として解釈されるため、-は変数名の一部として使用できません。

これを修正するには、私はあなたがこの投稿と同じようにそれを考え出し、そのような「データ・映像-ID」属性がありませんvideoElement['data-video-id'] = window.datavideoId;またはより良いvideoElement.setAttribute('data-video-id', window.datavideoId);