Question

以下代码按原样运行。我想使用此代码根据加载的页面显示特定的Twitch流。

<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>

当我尝试更换

时

“Defatank的直播页面”

下面的对象不起作用，并打破其余的情况。

<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>

我确定我可能错误地使用了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>

我也尝试从document.write（）中删除“”，它仍然没有加载并打破其余的情况。

Answer 1

对于您的具体情况，最简单的修复（在我看来）是将对象中的属性的双引号更改为单引号（否则它将结束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"

第二个字符串不起作用，因为解释器认为它在单词hi之前结束 - 如双引号所示。

第三个字符串很好，因为它使用单引号代替。

第四个字符串也很好，因为它“逃脱”双引号字符，让解释器知道下面的字符应该按字面处理而不是JavaScript代码。

这里有关于JavaScript字符串的更多详细信息：http://www.w3schools.com/js/js_obj_string.asp

总而言之，由于HTML规范允许使用单引号，双引号或不引用的属性，因此将双引号更改为单引号可以解决问题。

Answer 2

如果使用引号作为分隔符，则需要转义字符串内的引号。通常我使用apostropes来分隔带引号的字符串。

（但请注意，属性中的&字符应采用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>');

Answer 3

根据http://www.w3schools.com/jsref/met_doc_write.asp，

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

这意味着您无法将DOMObject或常规Object传递给document.write。如果您列出的那个“对象”实际上是一个字符串，那么您可以将它传递给document.write。如果您尝试向页面添加DOMObject，请尝试使用document.body.addChild(object);

Answer 4

您绝对不想使用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);

将document.write与<object> </object>一起使用

4 个答案: