Javascript不向输出发送数据

当下拉列表中的选定值更改时，我尝试运行JavaScript。但是脚本不起作用

这是我的下拉列表：

<div class="form-group">
  <label>Status</label>
    <div>
      <select class="form-control select2" id="data" name="data" style="width: 100%;">
        <option value="1">Data one</option>
        <option value="0">Data two</option>
    </select>
  </div>
</div>

地位
数据一
数据二

以下是我的javascript：

<script type="text/javascript">
  var dataEl = document.querySelector('#data'),
    outputEl = document.querySelector('#output');

    dataEl.onchange = function() {
      outputEl.innerHTML = dataEl.value 
        if (1 === dataEl.value) { '<b>Value one</b>' }
        if (0 === dataEl.value) { '<b>Value two</b>' }
  };
</script>

var dataEl=document.querySelector（“#data”），
outputEl=document.querySelector（“#output”）；
dataEl.onchange=函数（）{
outputEl.innerHTML=dataEl.value
如果（1==dataEl.value）{'value one'}
如果（0==dataEl.value）{'value two'}
};

当所选值=1时，脚本需要向输出发送

value one

。当所选值=0时，脚本需要向输出发送

值2

输出如下所示：

我还尝试将

selected

添加到选项中，但脚本仍然没有将数据发送到输出

有人知道怎么回事吗

元素
。value
是字符串，而不是数字。对
1==“1”

dataEl.onchange=function（）{
如果（dataEl.value==1）{outputEl.innerHTML='value one'}
如果（dataEl.value==0）{outputEl.innerHTML='value two'}
};
元素
。value
是字符串，而不是数字。对
1==“1”

dataEl.onchange=function（）{
如果（dataEl.value==1）{outputEl.innerHTML='value one'}
如果（dataEl.value==0）{outputEl.innerHTML='value two'}
};
试试看。我做了一些改变：

我将第二个选项的值改为“2”，而不是“0”
我将值与字符串“1”和“2”进行比较，而不是与数字1和2进行比较
我添加了代码来实际更改输出段落中的HTML
我在输出段落中输入了一个初始值
value one
，以便显示页面最初加载的时间
您的小提琴也被打断，因为输出段落在JavaScript执行点不存在。将其移到脚本上方


var dataEl=document.querySelector（'#data'），
outputEl=document.querySelector（“#output”）；
dataEl.onchange=函数（）{
如果（dataEl.value==“1”）{
outputEl.innerHTML='Value one'；
}else if（dataEl.value==“2”）{
outputEl.innerHTML='Value two'；
}
};

地位
数据一
数据二
Value one
尝试一下。我做了一些改变：

我将第二个选项的值改为“2”，而不是“0”
我将值与字符串“1”和“2”进行比较，而不是与数字1和2进行比较
我添加了代码来实际更改输出段落中的HTML
我在输出段落中输入了一个初始值
value one
，以便显示页面最初加载的时间
您的小提琴也被打断，因为输出段落在JavaScript执行点不存在。将其移到脚本上方


var dataEl=document.querySelector（'#data'），
outputEl=document.querySelector（“#output”）；
dataEl.onchange=函数（）{
如果（dataEl.value==“1”）{
outputEl.innerHTML='Value one'；
}else if（dataEl.value==“2”）{
outputEl.innerHTML='Value two'；
}
};

地位
数据一
数据二
Value one
将p.output移到jsfiddle中的脚本之前将p.output移到jsfiddle中的脚本之前，该脚本是由于
\output
未在
元素之前定义的
dataEl.onchange = function() {
    if (dataEl.value == 1) { outputEl.innerHTML = '<b>Value one</b>' }
    if (dataEl.value == 0) { outputEl.innerHTML = '<b>Value two</b>' }
};