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 ...
随机推荐
- WinForm中DataGridView的TextBoxColumm换行
一.内容超过显示宽度自动换行: 在需要自动换行的列中设置 二.换行符换行: 一开始在需要换行的文本添加"\r\n"并不能直接换行,DGV直接把\r\n显示出来了,后换成 Syste ...
- bootstrap基础学习小记(二)排版、列表、代码风格、表格
排版——标题.副标题.段落(正文文本).强调内容.粗体.斜体.强调相关的类.文本对齐 <!DOCTYPE HTML> <html> <head> <meta ...
- WPF 右上角带数字的按钮
效果如图所示 三种方案, 1:不改控件模版,布局实现,死开 2:改button模版,利用附加属性,附加附加属性,功能多了话,不利于拓展 3:继承button,添加依赖属性,接下来是这种 1:新建类 为 ...
- 基于emoji 国际通用表情在web上的输入与显示的记录
定义: emoji 即国际通用表情 场景: 1,ios,android,wp上emoji表情输入与显示 2,web也需作为支撑平台对emoji表情就行输入与显示(解析) 问题: 1,app端输入的表情 ...
- 微服务 - Eureka注册中心
我们来解决微服务的第一问题,服务的管理. 服务中心对外提供服务,需要对外暴露自己的地址.而consumer(调用者)需要记录服务提供者的地址.将来地址出现变更,还需要及时更新.这在服务较少的时候并不觉 ...
- ST表的原理及其实现
ST表类似树状数组,线段树这两种算法,是一种用于解决RMQ(Range Minimum/Maximum Query,即区间最值查询)问题的离线算法 与线段树相比,预处理复杂度同为O(nlogn),查询 ...
- flask_mysql入库
mysql 的入库和MongoDB的有一点点的区别 不过都很重要,都必须要掌握的技能, 现在我来演示一下mysql入库的过程: 首先 我们要导包,这是必不可少的一部分,都不用我说了吧 #导报 imp ...
- Twisted 框架 初印象
上面是twisted官网推荐的书籍,从封面可以看到,是一堆大蟒(python)纠缠在一起,这里可以说明twisted是一个基于pyhton语言,支持各种网络协议(包括UDP,TCP,TLS和其他应用层 ...
- [Spring]@Autowired,@Required,@Qualifier注解
@Required注解 @Required注解用于setter方法,表明这个属性是必要的,不可少的,必须注入值 假设有个测试类,里面有name和password两个属性 我给两个属性的setter方法 ...
- WebDriver高级应用实例(8)
8.1使用Log4j在测试过程中打印日志 目的:在测试过程中,使用Log4j打印日志,用于监控和后续调试测试脚本 被测网页的网址: http://www.baidu.com 环境准备: (1)访问ht ...