1

The code below works as is. I want to use this code to display specific Twitch streams based on the page that is loaded.

<script type="text/javascript">
    var stream = location.pathname;
    switch (stream) {
       case "/defatank":
          document.write("Defatank's Live Stream Page");
          break;
       case "/seeingblue":
          document.write("SeeingBlue's Live Stream Page");
          break;
       case "/shiroshii":
          document.write("Shiroshii's Live Stream Page");
          break;
       case "/theend66":
          document.write("TheEnd66's Live Stream Page");
          break;
       case "/wakawaka647":
          document.write("WakaWaka647's Live Stream Page");
          break;
       case "/xtheguythatplays":
          document.write("XTheGuyThatPlays' Live Stream Page");
          break;
    }
    </script>

When I try to replace

"Defatank's Live Stream Page"

with the object below it doesn't work and breaks the rest of the cases.

<object type="application/x-shockwave-flash" height="378" width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=defatank" bgcolor="#000000"><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" /><param name="flashvars" value="hostname=www.twitch.tv&channel=defatank&auto_play=true&start_volume=25" /></object>

I'm sure I'm probably using document.write wrongly or should be using something entirely different. Any suggestions?

EDIT: Here is what the finished product looks like.

<script type="text/javascript">
    var stream = location.pathname;
    switch (stream) {
       case "/defatank":
          document.write("<object type="application/x-shockwave-flash" height="378" width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=defatank" bgcolor="#000000"><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" /><param name="flashvars" value="hostname=www.twitch.tv&channel=defatank&auto_play=true&start_volume=25" /></object>");
          break;
       case "/seeingblue":
          document.write("SeeingBlue's Live Stream Page");
          break;
       case "/shiroshii":
          document.write("Shiroshii's Live Stream Page");
          break;
       case "/theend66":
          document.write("TheEnd66's Live Stream Page");
          break;
       case "/wakawaka647":
          document.write("WakaWaka647's Live Stream Page");
          break;
       case "/xtheguythatplays":
          document.write("XTheGuyThatPlays' Live Stream Page");
          break;
    }
    </script>

I also tried removing the "" from document.write() and it still dont load and breaks the rest of the cases.


As you can find on the Jade reference page in the "conditionals" section, you can use both as it says :

Jade's first-class conditional syntax allows for optional parenthesis, and you may now omit the leading - otherwise it's identical, still just regular javascript

4

4 に答える 4

2

あなたの特定のケースでは、(私の意見では)最も簡単な修正は、オブジェクトの属性の二重引用符を単一のものに変更することです(それ以外の場合は、document.write文字列を終了します)。これはうまくいくはずです

<script type="text/javascript">
    var stream = location.pathname;
    switch (stream) {
       case "/defatank":
          document.write("<object type='application/x-shockwave-flash' height='378' width='620' id='live_embed_player_flash' data='http://www.twitch.tv/widgets/live_embed_player.swf?channel=defatank' bgcolor='#000000'><param name='allowFullScreen' value='true' /><param name='allowScriptAccess' value='always' /><param name='allowNetworking' value='all' /><param name='movie' value='http://www.twitch.tv/widgets/live_embed_player.swf' /><param name='flashvars' value='hostname=www.twitch.tv&channel=defatank&auto_play=true&start_volume=25' /></object>");
          break;
       case "/seeingblue":
          document.write("SeeingBlue's Live Stream Page");
          break;
       case "/shiroshii":
          document.write("Shiroshii's Live Stream Page");
          break;
       case "/theend66":
          document.write("TheEnd66's Live Stream Page");
          break;
       case "/wakawaka647":
          document.write("WakaWaka647's Live Stream Page");
          break;
       case "/xtheguythatplays":
          document.write("XTheGuyThatPlays' Live Stream Page");
          break;
    }
</script>

JavaScript インタープリターは文字列の開始位置と終了位置を認識する必要があり、そのために引用符が使用されます。JavaScript 文字列には一重引用符または二重引用符を使用できます。文字列を区切るために使用したのと同じ引用タイプを文字列で使用する場合は、その引用文字をエスケープする必要があります。そうしないと、インタープリターが混乱し、文字列が早期に終了したと見なします。

いくつかの例

1. "Good string"
1. "Broken "hi" string"
1. "Good 'hi' string"
1. "Good \"hi\" string"

2 番目の文字列は、二重引用符で示されているように、単語 hi の直前で終了したとインタープリターが判断するため、機能しません。

3 番目の文字列は、代わりに hi に単一引用符を使用しているため問題ありません。

4 番目の文字列も問題ありません。これは、二重引用符文字を「エスケープ」して、後続の文字を JavaScript コードとしてではなく文字通りに扱う必要があることをインタープリターに知らせるためです。

JavaScript 文字列の詳細については、http ://www.w3schools.com/js/js_obj_string.asp を参照してください。

要約すると、HTML 仕様では単一引用符、二重引用符、または引用符で囲まれていない属性が許可されているため、二重引用符を単一引用符に変更すると問題が解決します。

于 2013-08-09T22:57:07.860 に答える
2

引用符を区切り文字として使用する場合は、文字列内の引用符をエスケープする必要があります。通常、引用符を含む文字列を区切るためにアポストロピを使用します。

(ただし&、属性内の文字は、&amp;正しい HTML コードにするために HTML エンコードする必要があることに注意してください。)

document.write('<object type="application/x-shockwave-flash" height="378" width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=defatank" bgcolor="#000000"><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" /><param name="flashvars" value="hostname=www.twitch.tv&amp;channel=defatank&amp;auto_play=true&amp;start_volume=25" /></object>');
于 2013-08-09T22:59:21.033 に答える
0

あなたは絶対に使いたくないでしょうdocument.write。代わりに、DOM メソッドを使用して要素を作成および追加します。

var obj = document.createElement('object'),
    param = document.createElement('param');
object.setAttribute('type', 'application/x-shockwave-flash');
param.setAttribute('name', 'allowFullScreen');
obj.appendChild(param);
// rest of params and attributes
document.body.appendChild(obj);
于 2013-08-09T23:05:12.240 に答える
0

http://www.w3schools.com/jsref/met_doc_write.aspによると、

The write() method writes HTML expressions or JavaScript code to a document.

これは、DOMObject または通常のオブジェクトを document.write に渡すことができないことを意味します。リストした「オブジェクト」が実際に文字列である場合は、それを document.write に渡すことができます。ページに DOMObject を追加しようとしている場合は、使用してみてくださいdocument.body.addChild(object);

于 2013-08-09T22:53:25.977 に答える