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 ...
随机推荐
- Linux Buffer/Cache 的区别
以前经常使用free -h命令来查看当前操作系统的内存使用情况,同时也注意过返回信息中有一列是buff/cache,来公司之前,面试官还问过我这两个的区别,当时没有回答出来,现在特意回顾记录下: ...
- 不合法的DB Index
redis报错,Invalid Db Index . 需要清理一下redis, 进入redis文件加下,登录redis, redis-cli ,输入账号密码, flush all, 回收程序池,重新生 ...
- Python3.5 学习十九 Django分模块讲解 MTV+URL
本节内容概述: 表单提交的Method使用规则:get 获取数据 post提交数据 单选使用get 多选使用getlist request.POST.getlist("favor" ...
- 564. Find the Closest Palindrome
Given an integer n, find the closest integer (not including itself), which is a palindrome. The 'clo ...
- 深入理解String类
1.String str = "eee" 和String str = new String("eee")的区别 先看一小段代码, public static v ...
- Swift5 语言指南(二十四) 泛型
通用代码使您能够根据您定义的要求编写可以使用任何类型的灵活,可重用的函数和类型.您可以编写避免重复的代码,并以清晰,抽象的方式表达其意图. 泛型是Swift最强大的功能之一,Swift标准库的大部分内 ...
- centos7上mysql5.6版本主从复制
做主从复制实验: 第一步:主服务器上操作 1.修改主服务器master: [root@localhost ~]# vim /etc/my.cnf server_id = 1 //[必须]服务器唯一I ...
- odoo开发笔记 -- odoo web机制浅析
http://blog.csdn.net/M0relia/article/details/39025947
- MethodImplOptions.Synchronized的一点讨论
Review代码发现有一个方法加了[MethodImpl(MethodImplOptions.Synchronized)] 属性,这个属性的目的,从名字上就可以看出,是要对所有线程进行同步执行. 对方 ...
- (转)如何入门 Python 爬虫
“入门”是良好的动机,但是可能作用缓慢.如果你手里或者脑子里有一个项目,那么实践起来你会被目标驱动,而不会像学习模块一样慢慢学习. 另外如果说知识体系里的每一个知识点是图里的点,依赖关系是边的话,那么 ...