Javascript 内部HTML代码<；脚本>；标签_Javascript_Html

Javascript 内部HTML代码<；脚本>；标签

javascript html

Javascript 内部HTML代码<；脚本>；标签,javascript,html,Javascript,Html,我很难在JavaScript逻辑中执行一段HTML代码，我想知道是否有人能指出我做错了什么？我试图实现的是基于概率运行任何一个视频。这是我的密码： <html> <head>.</head> <body> <script> function myFunction() { var chance = (( Math.random()*100)+1) if (chance>= 0 || chance<=50){

我很难在JavaScript逻辑中执行一段HTML代码，我想知道是否有人能指出我做错了什么？我试图实现的是基于概率运行任何一个视频。这是我的密码：

<html>
<head>.</head>
<body>
<script>
function myFunction() {
    var chance = (( Math.random()*100)+1)
    if (chance>= 0 || chance<=50){

        <video controls autoplay name="media">
    <source src="http://webmup.com/195a3/vid.webm" type="video/webm">
        </video>

}
    else {

        <video controls autoplay name="media">
        <iframe width="420" height="315"
    <source src="https://www.youtube.com/embed/IdtKbq3Omkw" type="video/webm">
        </ifrmae>
        </video>

}
}
</script>

</body>
</html>


.
函数myFunction（）{
var chance=（（Math.random（）*100）+1）
如果（chance>=0 | | chance如注释所示..这不是您应该做的..您可以尝试一下，也许它会让您了解如何将javascript与html结合使用：
<html>
<head>
</head>
<body>
<div id="container"></div>
<script>
var container = document.getElementById('container');
function myFunction() {
    var chance = (( Math.random()*100)+1)
    if (chance>= 0 || chance<=50){

    container.innerHTML = '<video controls autoplay name="media"><source src="http://webmup.com/195a3/vid.webm" type="video/webm"></video>';

}
    else {

    container.innerHTML = '<video controls autoplay name="media"><iframe width="420" height="315"><source src="https://www.youtube.com/embed/IdtKbq3Omkw" type="video/webm"></iframe></video>';

}
}
</script>

</body>
</html>


var container=document.getElementById（'container'）；
函数myFunction（）{
var chance=（（Math.random（）*100）+1）
if（chance>=0 | | chancehtml标记，如
应放在JavaScript函数的外部和html的
标记的内部
首先，您希望使用getElementById
查询视频元素。在这两种情况下，我们都创建了源
元素，因此我们可以在条件块之外声明该元素
我们可以使用setAttribute
函数设置属性，如src
和type
。然后，我们可以使用appendChild
函数将源元素作为子元素添加到视频元素中
<body>
  <video id="my-video" controls autoplay name="media">
  </video>
</body>

function myFunction() {
    var video = document.getElementById("my-video");
    var source = document.CreateElement("source");
    source.setAttribute("type", "video/webm");

    var chance = (( Math.random()*100)+1)
    if (chance >= 0 || chance <= 50) {
        source.setAttribute("src", "http://webmup.com/195a3/vid.webm");
        video.appendChild(source);

    } else {
        var iframe = document.createElement("iframe");
        iframe.setAttribute("width", "420");
        iframe.setAttribute("height", "315");
        video.appendChild("iframe");
        source.setAttribute("src", "https://www.youtube.com/embed/IdtKbq30mkw");
        iframe.appendChild(source");

    }
}


函数myFunction（）{
var video=document.getElementById（“我的视频”）；
var source=document.CreateElement（“源”）；
source.setAttribute（“类型”、“视频/webm”）；
var chance=（（Math.random（）*100）+1）
如果（机会>=0 | |机会你不能那样做
但是你可以使用模板
两个都是w/wojquery

function jq（）{return$（'useJquery'）.prop（'checked'）}
函数replace（）{return$（'#replace'）.prop（'checked'）}
$（函数（）{$（'#按钮'）。单击（函数（）{run（）；}）}）
函数run（）{
if（jq（））{
if（replace（））{$（“#container”）.html（“”）}
$（“#容器”）.append（$（（Math.round（Math.random（））？$（“#template1”）：$（“#template2”）.html（））；
}否则{
if（replace（））{document.getElementById（“容器”）.innerHTML='''}
document.getElementById（“容器”）.innerHTML+=document.getElementById（（Math.round（Math.random（））？“template1”：“template2”）.innerHTML；
}
}

使用jQuery？
代替
我选择了：视频1
我选择了：视频2
既然您没有用jQuery标记它，我假设您不想使用它。但是您仍然可以使用“模板”，即使没有它：
将每个模板放在一个脚本标记中，标记类型为=“text/template”：

带Iframe
html不是javascript，不能像在php中那样混合使用。你需要正确地创建元素并将它们添加到dom中。或者将它们都隐藏在dom中，只显示你想要的元素want@FelipeAlarcon这就是我们在这里的目的：帮助人们理解。不是因为他们问问题而责骂他们。我的投票实际上会投给这一个。更多比我的回答更简洁、更干练我认为我们不应该鼓励新手在Javascript代码中嵌入HTML。这导致了黑暗的一面：-）我们不是一开始都这么做吗：）？嘿，伙计，谢谢你花时间来帮助我。使用你提供的fiddle链接，其中一个iframe没有显示视频，你知道这是什么原因吗？我找不到根。再次感谢。我只是直接获取了你的HTML（除了我修复了错误的iframe结束标记）。但是，仔细检查后，您的HTML可能丢失了一部分。您有一个开始标记，但没有结束括号。然后您有了标记开始。请确保将HTML放在HTML中时可以正常工作。然后只需将工作的HTML移到脚本标记中，就像我所做的那样。
<script id="withIframe" type="text/template">
  <p>With Iframe</p>
  <video controls autoplay name="media">
    <iframe width="420" height="315" <source src="https://www.youtube.com/embed/IdtKbq3Omkw" type="video/webm">
      </iframe>
  </video>
</script>

<script id="withoutIframe" type="text/template">
  <p>Without Iframe</p>
  <video controls autoplay name="media">
    <source src="http://webmup.com/195a3/vid.webm" type="video/webm">
  </video>
</script>

<div id="holder">
</div>

var iframe = document.getElementById("withIframe").innerHTML;
var noiframe = document.getElementById("withoutIframe").innerHTML;

function myFunction() {
  var chance = ((Math.random() * 100) + 1);
  var output = '';
  if (chance <= 50) {

    output = noiframe;

  } else {

    output = iframe;

  }

  document.getElementById("holder").innerHTML = output;
}

myFunction();

 chance>= 0 || chance<=50