javascript.中。如何给多个元素添加同一个JS事件

<style type="text/css">
div{width: 150px;height: 150px;background: red;margin-bottom:5px;
}
</style>
<title></title>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>

<script type="text/javascript">
window.onload = function() {
var o =document.getElementsByTagName('div')[0];
o.onmouseover = function(){
o.style.opacity = 0.5;
}
o.onmouseout =function(){
o.style.opacity = 1;
}
}
</script>
</body>
</html>
比如4个div.我希望鼠标移入透明度变为0.5,鼠标移除变为1,给其中1个div加效果我知道怎么写,据说用for循环,但具体怎么写啊?(不要用伪类,)

<html>
<head>
<style type="text/css">
div{width: 150px;height: 150px;background: red;margin-bottom:5px;
}
</style>
  <title></title>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<script type="text/javascript">
window.onload = function() {
  var divs = document.getElementsByTagName("div");//获取所有的div
  for(var i = 0; i<divs.length; i++) {//循环让每个div都有效果
    divs[i].onmouseover = function(){
      this.style.opacity = 0.5;
    }
    divs[i].onmouseout =function(){
      this.style.opacity = 1;
    } 
  }
}
</script>
</body>
</html>
温馨提示:内容为网友见解,仅供参考
第1个回答  2016-11-21
window.onload = function() {
var arr  =document.getElementsByTagName('div');
for (var i = 0; i < arr.length; i++) {
    var o = arr[i];
    o.onmouseover = function(){
o.style.opacity = 0.5;
    }
    o.onmouseout =function(){
o.style.opacity = 1;
    }
}
}

javascript.中。如何给多个元素添加同一个JS事件
div{width: 150px;height: 150px;background: red;margin-bottom:5px;} window.onload = function() { var divs = document.getElementsByTagName("div");\/\/获取所有的div for(var i = 0; i<divs.length; i++) {\/\/循环让每个div都有效果 divs[i].onmouseover = function(){ ...

javascript多个标签共用同一个处理函数问题?
因为mouseover是事件,内部代码不是在ready的时候执行,所以和ajax一样,等同于是是异步执行的,加上js的变量作用域,你的代码会出现这样的问题:你在mouseover 或者 ajax的success中访问外层的变量i,发现i永远是最大值,效果就是不管你触摸哪条线,都只有最后一条线有反映。正确的jQuey用法如下 \/\/代...

javascript如何给每一个子元素都绑定点击事件?
绑定事件你写对了呀?但是前提你必须引用js。我们元素绑定一个事件 href="javascript:addPanel('userpage')"那下面就必须要有一个 当然我们也不一定要这样也可以 ('#ControlId').click()...

JS如何同时获取3个HTML元素进行相同操作
你好,可以通过调用该元素的ID还进行操作。我写了个小例子。 无标题文档 function kk(total){ for(i=1;i<=total;i++){ document.getElementById("id"+i).style.width = '100px';document.getElementById("id"+i).style.height = '100px';} } dsfdsf ...

用JavaScript怎样选中表格一行,将信息存到一个js方法中
你给每行一个按钮,在按钮的onclick方法里通过document.getElementById获得选中的行,通过获得页面元素的value获得选中的值,再调用你的delete方法。delete方法接受传入的数据,再生成url,通过post或者get方法将数据提交给action,action里通过request.getParameter获得传入的参数。以上说的很笼统,你什么不清楚再...

javascript 给相同元素指定同一事件怎么做?
if(i % 2 == 0){ with(this){ filters.apply();style.background='#CBECFF';style.border='1px solid #336699';filters.play();} }else{ with(this){ filters.apply();style.background='#F5F9FF';style.border='1px solid #336699';filters.play();} } onclick=function(){ if(...

在JS 中给一个DIV添加一个JS应该怎么做
\/> function addEvt(e){ var obj=document.getElementById("dd");dd.onclick=function(){ alert("OK!")} alert("点击事件添加成功,点击红色的层会弹出对话框!");e.outerHTML="";obj.innerHTML="点击此处会有弹出对话框"}

JavaScript中将取得的多个值合并成一个值
JS获取一个input的值的方法就是获取该元素的value属性。常用就是 document.getElementById('TelePerson').value 至于为什么要加setTiemout,是因为万恶的IE6下,onpress事件发生在input的value改变之前,所以在onpress事件里不能获取对象变化后的值 function change(){ setTimeout(function(){ document....

javascript中怎么给数组末尾添加元素?
在JavaScript中,给数组末尾添加元素主要使用的是数组的`push()`和`concat()`方法。这里我将详细解释这两种方法的使用。首先,使用`push()`方法。这是一个原生数组方法,用来直接在数组尾部添加一个或多个元素。方法的调用格式是`array.push(element1, element2, ..., elementN)`。例如,如果你有一...

js数组添加元素
JavaScript中的数组是一种特殊的对象,可以存储多个值在一个连续的线性存储空间中。当我们需要在数组的末尾添加新元素时,有多种常见方法可以使用。push 方法 最常用的是`push`方法。它可以将一个或多个元素添加到数组的末尾,并返回新数组的长度。例如:javascript let arr = [1, 2, 3]; \/\/ 定义...

相似回答