select元素的options.add 与 insertbefore的区别
之前写了js checkbox.checked=true在document.body.appendChild(checkbox)前与后赋值，提到如果想改变元素的视觉效果（checkbox.checked=true会打钩），请在把元素添加到页面上再为其赋值，否则赋值无效。下拉框元素也有这样的问题，比如在设置其selectedIndex属性时，会看到当前被选中的Item，浏览器重新绘画了这个元素。在某些情况下会出现这样的情况：用insertBefore方法添加了多个选项后，设置其selectedIndex不能起到效果，用options.add则不会。他们到底有什么区别呢？
测试代码如下：
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
</head>
<body onload="f()">
<select id="s">
</select>
</body>
<script>
function f(){
for(var i=0; i<10; i++){
var option = document.createElement('option')
//s.insertBefore(option)
s.options.add(option)
option.innerText = 'hello' + i
option.value = i
}
s.selectedIndex = 4
}
</script>
</html>
总结：这也算一个有点奇妙的问题吧。
select元素的options.add 与 insertbefore的区别相关推荐
- select元素javascript常用操作（转载）
/*------------------------------------------------------ *作者:xieyu @ 2007-08-14 *语言:JavaScript *说 ...
- JS 对select动态添加options操作[IEFireFox兼容]
JS 对select动态添加options操作[IE&FireFox兼容] 做一个项目,遇到了要动态调整 select 选项的情况,就baidu了一下,发现了一篇与本文同名的帖子. 但是呢,那 ...
- 改变select元素原来的事件属性,并加快捷键
<select name="commonNativeLanguage" style="width:150px"οnkeydοwn="select ...
- 原生js操作元素类名—classList.add()、classList.remove()、classList.contains()、classList.toggle()
原生js操作元素类名 classList.add( newClassName ): classList.toggle( className ): classList.remove( oldClassN ...
- MyBatis-03 MyBatis XML方式之select元素
概述 select用法 根据用户id查询用户信息 1.UserMapper接口中添加接口方法 2. UserMapper.xml中配置resultMap和select元素 查询全部的SysUser 添 ...
- Jquery操作表单Select元素常用方法
Jquery操作表单Select元素的用法: jQuery获取Select元素,并选择的Text和Value: 实例分析: 1. $("#select_id").change(fu ...
- 【笔记】css 自定义select 元素的箭头样式
原文链接:https://www.imooc.com/qadetail/187585?t=281881 最近项目需要自定义select 元素的样式,搜索了一下发现了通过设置select 元素 css ...
- 不要在foreach循环里进行元素的remove/add操作。remove元素请使用iteratot方式，如果并发操作，需要对Iterator对象加锁
不要在foreach循环里进行元素的remove/add操作.remove元素请使用iteratot方式,如果并发操作,需要对Iterator对象加锁
- mybatis 取查询值_Mybatis --- 映射文件、参数处理、参数值的获取、select元素
这样就可以在insert函数中获取新添加的用户的 id主键,否则获取不到 select * from student where id = #{id} insert into student(name ...
最新文章
- 【连载】优秀程序员的45个习惯之42——允许大家自己想办法
- SVM中为何间隔边界的值为正负1
- 从零开始搭建系统1.1——CentOs安装
- 免费公开课 | AI对抗攻防系列专题，今晚7点第一讲
- 两个线程，一个线程打印1~52，另一个线程打印字母A-Z，打印顺序为12A34B56C……5152Z...
- python 函数式编程包_python 函数支持函数式编程的包operator partial
- 求ax bx c 0的根c语言,关于求方程ax2+bx+c=0根的问题
- SP2010开发和VS2010专家食谱--第六章节--Web Services和REST（5）--Inserting new contacts through REST...
- Java编译器调试不了_使用Maven设置Java编译器的-source和-target-不起作用
- java集合的存储特征_Java集合常用类特点整理
- 无锡美景：踏过樱花第几桥
- VS2010格式化快捷键
- Linuxbt下载工具-Transmission-支持命令行
- 转载：子网掩码以及子网划分
- QQ抢车位助手（结尾）
- 2022年N1叉车司机考试题库及N1叉车司机证考试
- 吃完饭后，到底是躺着、坐着、站着还是运动？看完终于不纠结了
- Unity 在2D中实现LookAt
- Django笔记：应用和分布式路由（应用创建，分布式路由的配置，应用下的模板）
- 前端面试题总结（包含答案解析）