JS DOM操作(二) Window.docunment对象——操作样式
一 对元素的定位
在 js 中可以利用 id、class、name、标签名进行元素的定位
id、class 用在客户端
name 用在服务端
用 id 定位 -- 根据 id 最多只能找一个
var a = document.getElementById( "id 名" )
-- 将找到的变了放到变量 a 中
用 class 定位
var a = documen.getElementsByClassName( "class 名")
-- 根据classname找,找出来的是数组
用标记定位
var a = document.getElementsByTagName (" 标签名")
-- 根据标签名找,找出来的是数组
用 name 定位
var a = document.getElementsByName ( "name名" )
-- 根据 name 找,找出来的是数组
-- 在抓取的数组中即使只有一个变量也要用数组形式表现
二 掌握三个事件
onclick -- 点击事件
onmouseover --鼠标移入事件
onmouseout -- 鼠标移出事件
三 对样式的操作
1、利用定位找到元素存于变量中
var a = document.getElementById( " id " )
2、对该元素的样式进行操作
a.style.样式 = "值";
例
document.body.style.backgroundColor=" 颜色"
-- 改变整个窗口的背景颜色
-- 更改的样式作用在内联中,优先级最高,能够覆盖其他所有的样式。
-- 样式里带 “-” 要删掉,后面的第一个字母变为大写
-- 放在等号右边是取值,可以看到元素内联样式的值
index
-- 对象的属性,可以记录一个int类型的值
this . index = i ;
-- 将索引标记一下
i 在这里指for循环中的变量
this 代表对象如(a[0])
JS DOM操作(二) Window.docunment对象——操作样式的更多相关文章
- JS DOM操作(五) Window.docunment对象——操作元素
定位: var a = document.getElementByIt( "id" ) 同辈元素 var b = a.nextSibling; -- 找 a ...
- JS DOM操作(四) Window.docunment对象——操作内容
操作内容:即对标签所夹内容的操作 一 非表单元素内容操作 定位 var a = document.ElementById( "id" ) 1.获取内容 var s = a.inne ...
- JS DOM操作(三) Window.docunment对象——操作属性
属性:是对象的性质与对象之间关系的统称.HTML中标签可以拥有属性,属性为 HTML 元素提供附加信. 属性总是以名称/值对的形式出现,比如:name="value". 属性值始终 ...
- AIR文件操作(二):使用文件对象操作文件和目录
转载于:http://www.flashj.cn/wp/air-file-operation2.html 文件对象是啥?文件对象(File对象)是在文件系统中指向文件或目录的指针.由于安全原因,只在A ...
- JavaScript的DOM操作。Window.document对象
间隔执行一段代码:window.setlnteval("需要执行的代码",间隔毫秒数) 例 : window.setlnteval("alert("你 ...
- JS中基本window.document对象操作以及常用事件!
一.找到元素 1.document.getELementById("id"):根据id找,最多找一个. var a=document.getELementById("id ...
- DOM操作(Window.document对象)
间隔与延迟: 间隔一段代码: window.setInterval("代码",间隔执行秒数) 延迟一段时间后执行一段代码: window.setTimeout("执行代码 ...
- JS笔记(二):对象
(一) 对象 对象是JS的基本数据类型,类似于python的字典.然而对象不仅仅是键值对的映射,除了可以保持自有的属性,JS对象还可以从一个称为原型的对象继承属性,对象的方法通常是继承的属性.(这种对 ...
- JS事件(二)事件对象
html事件处理程序中,变量event中保存着事件对象 <button onclick="alert(ev.type)" id="btn">clic ...
随机推荐
- SQL SERVER的锁机制(二)——概述(锁的兼容性与可以锁定的资源)
二.完整的锁兼容性矩阵(见下图) 对上图的是代码说明:见下图. 三.下表列出了数据库引擎可以锁定的资源. 名称 资源 缩写 编码 呈现锁定时,描述该资源的方式 说明 数据行 RID RID 9 文件编 ...
- 也来谈一谈js的浅复制和深复制
1.浅复制VS深复制 本文中的复制也可以称为拷贝,在本文中认为复制和拷贝是相同的意思.另外,本文只讨论js中复杂数据类型的复制问题(Object,Array等),不讨论基本数据类型(null,unde ...
- Mac下更改Mysql5.7的默认编码为utf8
Mac上从官方安装完Mysql5.7后,有一部分的字符集默认为latin1,而非utf8,为避免乱码的产生,本文介绍将所有字符集设置为utf8 查看当前字符集编码 show variables lik ...
- 小猴打架(luogu4430)(数论+生成树计数)
一开始森林里面有\(N\)只互不相识的小猴子,它们经常打架,但打架的双方都必须不是好朋友.每次打完架后,打架的双方以及它们的好朋友就会互相认识,成为好朋友.经过\(N-1\)次打架之后,整个森林的小猴 ...
- BZOJ 2200--[Usaco2011 Jan]道路和航线(最短路&拓扑排序)
2200: [Usaco2011 Jan]道路和航线 Time Limit: 10 Sec Memory Limit: 259 MBSubmit: 1128 Solved: 414[Submit] ...
- [学习笔记]后缀自动机SAM
好抽象啊,早上看了两个多小时才看懂,\(\%\%\%Fading\) 早就懂了 讲解就算了吧--可以去看看其他人的博客 1.[模板]后缀自动机 \(siz\) 为该串出现的次数,\(l\) 为子串长度 ...
- java 简单认识移位运算符和位运算符
移位运算符和位运算符本质上都是操作二进制位,因为计算机存储的是二进制数据,运算效率相对较高. 移位运算符:把整数的二进制位进行左移或右移 .左移一位,相当于这个数乘以2, 右移一位,相当于这个数除以2 ...
- POJ 2665
#include<iostream> #include<stdio.h> using namespace std; int main() { //freopen("a ...
- web 基础
web服务器和应用服务器以及web应用框架: web服务器:负责处理http请求,响应静态文件,常见的有Apache,Nginx以及微软的IIS. 应用服务器:负责处理逻辑的服务器.比如php.pyt ...
- [Umbraco] 自定义DataType中Data Editor Setting Type
上一篇介绍了在定义Document Type中的属性时用到的Data Type,当使用dropdown list如何调用外部数据源,可以根据提供的数据连接字符串,sql语句就能实现你想要显示的数据. ...