【2017-03-30】JS-document对象
一、获取标记对象
1、document.getElementById("id"); 根据id找,最多找到一个。
2、document.getElementsByName("name"); 根据name找,找出来的是数组。
3、document.getElementsByClassName("name"); 根据classname找,找出来的是数组。
4、document.getElementsByTagName("name") 根据标签名找,找出来的是数组。
二、三个事件
1、点击事件
onclick
2、鼠标移入事件
onmouseover
3、鼠标移出事件
onmouseout
要给数组赋上事件必须进行循环:
var arr =document.getElementsByClassName("div1");
for(var i =0;i<arr.length;i++)
{
arr[i].onclick=function(){
this.style.backgroundColor="red"; //this 在循环中点谁谁变色
}
}
三、控制标记的样式
标记对象.style.样式="值";
var a =document.getElementById("btn1");
a.onclick=function(){
a.style.backgroundColor="red";
}
样式里带“-”的,要将“-”去掉,并且将其之后一个字母变成大写。
在JS里对象的index属性,可以记录一个int类型的值
【2017-03-30】JS-document对象的更多相关文章
- js document对象
document对象可以通过多种方式获取: 最常见的一种情况是,你在文档的script脚本中直接使用document,这个document代表运行着该脚本的文档.(这个document和window. ...
- js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象,但是不阻塞script方法
js里的setTimeout和setInterval是否进程阻塞? 阻塞浏览器的document对象,但是不阻塞script方法 当你在setTimeout中使用document.write时是不行的 ...
- JS中window.document对象
小知识点注:外面双引号,里面的双引号改为单引号: 在div里面行高设置和整个外面高度一样,才能用竖直居中,居中是行居中 文本框取出来 ...
- 5月15日上课笔记-js中 location对象的属性、document对象、js内置对象、Date事件对象、
location的属性: host: 返回当前主机名和端口号 定时函数: setTimeout( ) setInterval() 二.document对象 getElementById(); 根据ID ...
- JS之document对象(找元素、操作内容、操作属性、操作样式及4道例题)
document对象 一.找元素 1.根据id找 示例: <input id = "a" type="button" value="找元素&qu ...
- JS操作document对象
找到对象: document.getElementById():返回对拥有指定 id 的第一个对象的引用. document.getElementsByName():返回带有指定名称的对象集合. do ...
- jQuery、JS读取xml文件里的内容(JS先通过document.implementation.createDocument方法将xml转换成document对象,jQuery将读取到的xml转成table)
xml文件:test.xml <?xml version="1.0"?> <note> <to>George</to> <fr ...
- 报表软件JS开发引用HTML DOM的location和document对象
上一次提到,在报表软件FineReport的JavaScript开发中,可以访问并处理的HTML DOM对象有windows.location.document三种.这次就继续介绍后两种,locati ...
- JS中document对象和window对象有什么区别
简单来说,document是window的一个对象属性.Window 对象表示浏览器中打开的窗口.如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 windo ...
- JS开发引用HTML DOM的location和document对象
上一次提到,在报表软件FineReport的JavaScript开发中,可以访问并处理的HTML DOM对象有windows.location.document三种.这次就继续介绍后两种,locati ...
随机推荐
- 动态样式语言—LESS
博客原文地址:Claiyre的个人博客 https://claiyre.github.io/ 博客园地址:http://www.cnblogs.com/nuannuan7362/ 如需转载,请在文章开 ...
- DirectX11中Shader的封装
引言 这个寒假学DirectX11的时候用的书是<Introduction to 3D Game Programming with DirectX 11>,里面关于Shader的部分全 ...
- 什么是vue?
vue就是一个js库,并且无依赖别的js库,直接引入一个js文件就可以使用,跟jquery差不多.vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的 ...
- 下载安装Cygwin
下载程序 http://www.cygwin.com/ 安装程序 下载完成后,运行setup.exe程序,出现安装画面. 直接点“下一步”,出现安装模式的对话框,如下图所示: 这里可以看到有三种安装模 ...
- java数组、泛型、集合在多态中的使用及对比
我们在使用数组,泛型集合的过程中不可避免的会碰到多态,或者说什么情况下能如何使用父数组引用子数组(集合.泛型)呢? 数组在多态中的使用 元素为父类型的数组引用可指向元素为子类型的数组对象 当数组被调用 ...
- C# Windows 异步线程
Task t = new Task(new Action(() => { //推送产品 ...
- 面对考试毫无畏惧的SSH
[Struts+Spring+Hibernate] 新建一个项目 把SSH jar包(包含mysql.oracle.jackson等包在里面) 把web.xml复制到WebContent\WEB-IN ...
- 通过HttpClient 调用ASP.NET Web API
在前面两篇文章中我们介绍了ASP.NET Web API的基本知识和原理,并且通过简单的实例了解了它的基本(CRUD)操作.我们是通过JQuery和Ajax对Web API进行数据操作.这一篇我们来介 ...
- 《shell脚本学习指南》学习笔记之入门
为什么要使用shell脚本? shell脚本能够轻易处理文件与目录之类的对象,而且是各UNIX系统之间经过POSIX标准化的通用的功能,因此Shell脚本只要“用心写”一次,即可应用到很多系统上,因此 ...
- 第一章 初始java
一.单词 public:公共的 static:静态的 void:空的 class:类 print:打印 line:排 pro ...