【2017-03-30】JS document对象

本文介绍如何在JavaScript中通过ID、class、标签和name选择DOM元素,以及如何为这些元素添加点击、鼠标移入和移出事件。同时,讲解了如何通过JS控制元素样式,包括背景颜色的修改。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一、获取标记对象

1.   html中查找标记对象:class ,id ,标签

document获取标记对象

(1)id:            document.getElementById("元素id");                         根据id只能找到一个元素对象(html的id不会重复)

(2)class:        document.getElementsByClassName("class名称");      根据class找到一个数组数据

(3)标签名:      document.getElementsByTagName("标签名")              根据标签:div/input/span等。找到的是一个数组数据

(4)name名:    document.getElementsByName("name名");                根据name来查找,找到一个数组数据

2.   将找到的数据放到变量中:

var a=document.getElementById("元素id");                                       该类型只有一个值,操作时直接使用a

var a=documenr.getElementByClassName("class名称");                        该类型是一个数组,对数组内的单个元素操作使用for循环:a[i]

 

二、三个常用事件

1.点击事件onclick

a.onclick=function(){}

2.鼠标移入事件onmouseover

a.onmouseover=function(){}

3.鼠标移出事件onmouseout

a.onmouseout=function(){}

 

要给数组赋上事件必须进行循环:

var  arr =document.getElementsByClassName("div1");

for(var i =0;i<arr.length;i++)

{

   arr[i].onclick=function(){

     this.style.backgroundColor="blue";                   

    }

}

 三、控制标记的样式

1.元素标记.style.样式=“值”;

var a =document.getElementById("btn1");

a.onclick=function(){

a.style.backgroundColor="red";

}

js中background-color写作backgroungColor,样式里带“-”的,要将“-”去掉,并且将其之后一个字母变成大写

2.在对数组数据for循环遍历时,第一个元素是a[0]

要对某个元素的进行标记样式操作时,可用this来当做要抽取对象

3.在js里对象的index属性,可以记录一个int类型的值

转载于:https://www.cnblogs.com/snow22546/p/6649478.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值