JS中基本window.document对象操作以及常用事件!
一.找到元素
1.document.getELementById(“id”);根据id找,最多找一个。
var a=document.getELementById(“id”);把找到的元素放在变量a中。
2.getElementsByClassName()根据class找,找出来的是数组。
3.getElementsByName()根据name找,找出来的是数组。
4.getElementsByTagName()根据标签名找,找出来的是数组。
二.操作内容
1.非表单元素:例如var d=document.getElementsById(“a”);
1.获取文本:d.innerText 只取里面的文字!
2.设置文本:d.innerText=hello; 这时候里面的文字就会变成hello。
3.获取HTML代码:d.innerHTML 获取到d元素里面所套的所有标签以及文字!
4.设置HTML代码:d.innerHTML=<b>加粗文字</b>。
2.表单元素
表单元素的值是value
1.赋值:d.value=“赋值”;
2.获取值:alert(d.value);
三.操作属性
这不是属性,是方法1
1.添加属性:d.setAttribute(“属性名”,“属性的值”);
2.获取属性:d.getAttribute(“属性名”);
3.移除属性:d.removeAttribute(“属性名”);
四.操作样式
在JS中获取样式只能获取内联的!
1.d.style. 后面跟style中的你想要操作的样式。
五.常用的事件
加return 或 false是阻止默认操作
onclick:鼠标单击触发
ondblclick:双击触发
onmouserover:鼠标以上触发
onmouserout:鼠标移出触发
onmousermov:鼠标在上面移动是触发
onchange:只要内容改变是触发
onblur:失去焦点时触发
onfocus:获得焦点时触发
onkeydown:按键按下时触发
onkeyup:按键抬起时触发
onkeypress:事件在用户按下并放开任何字母数字键时触发。
JS中基本window.document对象操作以及常用事件!的更多相关文章
- JS中window.document对象
小知识点注:外面双引号,里面的双引号改为单引号: 在div里面行高设置和整个外面高度一样,才能用竖直居中,居中是行居中 文本框取出来 ...
- JavaScript——DOM操作——Window.document对象
一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docunment.getElementById(&qu ...
- JavaScript的DOM操作。Window.document对象
间隔执行一段代码:window.setlnteval("需要执行的代码",间隔毫秒数) 例 : window.setlnteval("alert("你 ...
- Window.document对象
1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docunme ...
- Window.document对象 轮播练习
Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docun ...
- HTML Window.document对象
1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docunmen ...
- Window.document对象(1)
1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docunme ...
- 1、Window.document对象
1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docunmen ...
- 3.26课·········window.document对象
1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docun ...
随机推荐
- Azure Blob Storage从入门到精通
今天推荐的是一个系列文章,让读者阅读完成后可以对Azure Blob Storage的开发有一个全面的了解,可谓是从入门到精通. Azure在最初的版本里面就提供了非结构化数据的存储服务,也即Blob ...
- Effective C++笔记:资源管理
资源:动态分配的内存.文件描述器.互斥锁.图形界面中的字型与笔刷.数据库连接以及网络sockets等,无论哪一种资源,重要的是,当你不再使用它时,必须将它还给系统. 条款13:以对象管理资源 当我们向 ...
- FactoryBean的使用
一般情况下,Spring通过反射机制利用bean的class属性指定实现类来实例化bean .在某些情况下,实例化bean过程比较复杂,如果按照传统的方式,则需要在<bean>中提供大量的 ...
- mvc-2事件监听
现代浏览器都支持的事件 click dbclick mouseover mousemove mouseout focus blur change(表单输入框特有) submit(表单特有) addEv ...
- node基础 --工具
npm //Node.js Package Manager 查询版本号:npm --version/npm version 查询模块:npm search <name> 查看模块相关信息 ...
- ember.js:使用笔记9 开始单元测试
单元测试被限定在一个范围内,并且不需要Ember应用运行. 使用前准备: 加入Ember-QUnit:获取一系列测试助手帮助单元测试:加入 mian.js; 加入根元素(与集成测试的时候一样):App ...
- ural 1157. Young Tiler
1157. Young Tiler Time limit: 1.0 secondMemory limit: 64 MB One young boy had many-many identical sq ...
- BZOJ4348 : [POI2016]Park wodny
首先特判全部都是A或者全部都是B或者$n=1$的情况. 然后把矩阵四周都填充上A,枚举一个块,分以下情况讨论: 1.在它四周选两个块扩展,此时平方暴力枚举即可. 2.在它四周选定一个方向扩展两步. 3 ...
- LightOJ 1422 (区间DP)
题目链接: http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=27130 题目大意:按顺序去参加舞会.每个舞会对衣服都有要求.可以 ...
- Codeforces Round #190 DIV.2 A. Ciel and Dancing
#include <cstdio> #include <iostream> #include <vector> using namespace std; int m ...