document.getElementById().value函数都必须在触发事件时使用才有效吗

<script>
  var xb=document.getElementById("xb");
  var t=parseInt(xb.value);
  console.log(xb);
  console.log(t);
  </script>
<body>
    
  <form>
   
   <select id="xb" value="1" >
    <option > 1 </option> 
   </select>
  </form>
 
</body>  
为什么在没有触发事件时使用这类函数没有效果甚至报错

biudiudiu 2019-09-18

源自：JavaScript入门 7-7 JS对表单元素进行设置4

收起

3回答

好帮手慕小班回答被采纳获得+3积分 2019-09-18 17:37:57

同学你好，1、不建议将script的内容放在head中加载，因为如果放在head中，页面的加载顺序是自上而下的，在head中加载script内容时，页面中的对象等内容可能还没有加载，就获取不到，此时在控制台中会报错的，例如：

对应

2、将script方法body的底部就不会报错了哦，例如：

对应在页面中就不会报错

3、同学说自己的控制台报错，请问报错内容是什么呐。建议同学贴出报错截图。

如果我的回答解决了你的疑惑，请采纳，祝学习愉快~

收起回答

好帮手慕小班 2019-09-18 15:35:56

同学你好，1、document.getElementById().value不是只能用在触发事件中，也可以直接获取到这个对象的value值，例如：

对应在页面中：

2、options集合可返回包含 <select> 元素中所有 <option> 的一个数组。

var xb=document.getElementById("xb"),xb是获取到了这个select对象，xb.options就是获取到这个select中所有的option的集合

对应xb.options.length就是获取到这个集合的长度，xb.options.add()就是插入一个新的option元素。其中new Option(参数1，参数2)，通过调用构造函数 Option()，来创建一个新的 option 对象。

如果我的回答解决了你的疑惑，请采纳，祝学习愉快~

收起回答

提问者 biudiudiu #1

想问一下<script>标签的位置对在控制台的输出有什么影响吗，比如说放在<head>标签和<body>标签内有什么不同呢

2019-09-18 15:51:01
提问者 biudiudiu #2

<body> <form> <select id="xb" value="1"> </select> </form> <script> var xb=document.getElementById("xb").value; console.log(xb); </script> </body>

2019-09-18 15:53:28
提问者 biudiudiu #3

为什么我的这种形式就控制台就报错呢

2019-09-18 15:54:06