multiple. select列表多选
触发事件后调用有参数的函数要先创建一个函数，然后在函数内调用执行函数
Array.from（伪数组）：伪数组变为真数组
indexOf（）：查询字符的索引
a) indexOf（‘abcde’）
i. indexOf（‘a’）的索引是0
ii. indexOf（‘abc’）的索引是0，按照第一个字符的索引
iii. indexOf（‘ac’）的索引是-1，查找不到ac连续的字符
iv. indexOf（‘f’）的索引是-1，查询不到返回-1
BOM：浏览器对象模型window是javascript的*对象
window内置很多方法
window.open（url，target，paranm）
a) url：地址
b) target：打开新窗口的方式，_blank/
5. window.close()关闭窗口
6. ocation.href = “跳转到的新网址”
7. setTimeout（function （）{},5000(单位：毫秒)）
a) 炸弹定时器 ，只执行一次执行完报废
8. history 历史记录管理
a) back：回退
b) go（-1）；0 是刷新
定时器刷新页面，
固定时间执行一段代码
定义方法
a) setInterval（匿名函数，间隔时间（单位毫秒））；
b) senInterval（函数，间隔时间）；
c) setInterval（“函数”，间隔时间）
3. clearInterval（定时器的一个ID值，由setInterval返回）
4. script中只能获取行内式样式，内联和内的无法获取
//返回值，清除定时器。
var num = 1;
//setInterval他的返回值就是定时器的名字
var timer = setInterval(function () {
console.log(num);
num++
if(num===10){
//如何停止定时器呢？？？
clearInterval(timer);
}
},500);
window.onload = function () { //获取相关元素 var imgArr = document.getElementsByTagName("img"); //设置定时器 setTimeout(fn,5000); function fn(){ imgArr[0].style.display = "none"; imgArr[1].style.display = "none"; } }
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style> 7 select { 8 width: 170px; 9 height: 200px; 10 font-size: 16px; 11 background-color: #a4ff43; 12 } 13 </style> 14 </head> 15 <body> 16 <select size="10" multiple> 17 <option value="0">香蕉</option> 18 <option value="1">苹果</option> 19 <option value="2">鸭梨</option> 20 <option value="3">葡萄</option> 21 </select> 22 <input type="button" value=">>>"/> 23 <input type="button" value="<<<"/> 24 <input type="button" value=">"/> 25 <input type="button" value="<"/> 26 <select size="10" multiple> 27 28 </select> 29 30 <script> 31 //需求1：点击>>>和<<<两个按钮，所有的子元素都跑到对方的标签中。 32 //步骤： 33 //1.获取相关元素，并绑定事件 34 //2.获取子元素，整体的添加到另外一边的标签中 35 36 //1.获取相关元素，并绑定事件 37 var sel1 = document.getElementById("sel1"); 38 var sel2 = document.getElementById("sel2"); 39 var inpArr = document.getElementsByTagName("input"); 40 41 inpArr[0].onclick = function () { 42 //2.获取子元素，整体的添加到另外一边的标签中 43 var arr = sel1.children; 44 //循环遍历放入另一侧的select标签中 45 for(var i=arr.length-1;i>=0;i--){ 46 //放入sel2中，不能用push，要用appendChild; 47 sel2.appendChild(arr[0]); 48 } 49 } 50 //同理 51 inpArr[1].onclick = function () { 52 //2.获取子元素，整体的添加到另外一边的标签中 53 var arr = sel2.children; 54 //循环遍历放入另一侧的select标签中 55 for(var i=arr.length-1;i>=0;i--){ 56 //放入sel2中，不能用push，要用appendChild; 57 sel1.appendChild(arr[0]); 58 } 59 } 60 61 //需求2：点击>和<两个按钮，所有被选定的子元素都跑到对方的标签中。 62 //思路：获取所有子节点，然后循环判断，只有selected属性值为true的选项才能被添加到右侧的select标签中 63 inpArr[2].onclick = function () { 64 //获取所有子节点 65 var arr = sel1.children; 66 //遍历判断数组中的元素selected属性为true的，添加到相反的select标签中 67 for(var i=arr.length-1;i>=0;i--){ 68 if(arr[i].selected === true){ 69 // arr[i].selected = false; 70 sel2.appendChild(arr[i]); 71 } 72 } 73 } 74 //同理 75 inpArr[3].onclick = function () { 76 //获取所有子节点 77 var arr = sel2.children; 78 //遍历判断数组中的元素selected属性为true的，添加到相反的select标签中 79 for(var i=arr.length-1;i>=0;i--){ 80 if(arr[i].selected === true){ 81 // arr[i].selected = false; 82 sel1.appendChild(arr[i]); 83 } 84 } 85 } 86 87 88 </script> 89 90 91 </body> 92 </html>
选中的value跑到另外一个表格中（简单版）