DM是(Document Object Model)的简称。
一.找元素
- document.getElementById() 根据id选择器找,最多找一个;
- document.getElementsByName() 根据name找,找出的是数组;
- document.getElementsByclassName() 根据类选择器找,找出的也是数组;
- document.getElementsByTagName() 根据标签名找,找出的是数组;
二.获取内容
- 非表单元素:alert(a.innerHTML);获取代码和内容,但只显示内容。
- alert(a.innerText);提取代码和内容。
- 表单元素:alert(a.value); 获取input中的value值。
三.操作属性
- a.setAttribute("属性名","属性值"); 添加或更改一个属性。
- a.getAtrribute("属性名");获取属性的值。
- a.removeAttribute("属性名"); 移除属性。
四.设置样式
rush:js;">
var a = document.getElementsByClassName("a");
a[o].style.background-color="red"; //(只能取钳在body里边的)
五.相关元素操作
- var b = a.nextSibling; 找a的下一个同辈元素,注意包含空格。
- var b = a.prevIoUsSibling,找a的上一个同辈元素,包含空格。
- var b = a.parentNode,找a的上一级父级元素。
- var b = a.firstChild,第一个元素; lastChild 最后一个; childNodes[n]找第n个;
五.元素的创建、添加、删除
var obj = document.createElement('标签名');
a.selectedindex 选中的是第几个; a.options[a.selectedindex] //取出第几个option对象;
六. 字符串操作
var s = "hello world";
alert(s.toLowerCase()); 转小写 toupperCase();转大写
alert(s.substring(3,8)) 从第三个位置截取到第八个位置
alert(s.substr(3,8)); 从第三个位置截取,截取八个字符长度。不写后面数字是截到最后。
s.split('') 将字符串按照指定字符拆开。
七.事件
- onclick: 鼠标单击触发
- ondblclick: 鼠标双击触发
- onmouSEOver:鼠标移动到上面触发
- onmouSEOut:鼠标离开时触发
- onmousemove:鼠标在上面移动时触发
- onchange:只要内容改变触发
- onblur:失去焦点时触发
- onfocus:获得焦点时触发
- onkeydown:按键按下时触发
- onkeyup:按键抬起时触发
- onkeypress: 在用户按下并放开任何字母数字键时发生,但是系统按钮(例:箭头键、功能键)无法识别
例题解析:1.复选框按钮,下一步可用
rush:js;">
无标题文档
<input id="tong" type="checkbox" name="ch" ckecked="checked" value="1" onclick="ck_yes()")/>
<label for="tong">同意
<input type="button" value="下一步" id="btn" disabled="disabled"/>
<input id="tong" type="checkbox" name="ch" ckecked="checked" value="1" onclick="ck_yes()")/>
<label for="tong">同意
<input type="button" value="下一步" id="btn" disabled="disabled"/>
2.两个下拉框互传内容
rush:js;">
无标题文档
3.三个下拉框日期选择
rush:js;">
<Meta charset="UTF-8">
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。
原文地址:https://www.jb51.cc/js/39732.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。