js获取class对象的值
<body><spanclass="okdog"lay-id="user1">1只狗</span><spanclass="okdog"lay-id="user2">2只狗...
<body>
<span class="okdog" lay-id="user1">1只狗</span><span class="okdog" lay-id="user2">2只狗</span><span class="okdog" lay-id="user3">3只狗</span><span class="okdog" lay-id="user4">4只狗</span><span class="okdog" lay-id="user5">5只狗</span>
<div id="showdog">输出结果</div>
<script>
</script>
</body>
有若干个class对象，点击其中任意一个，返回它的值，比如点击第二个span，就返回2只狗，就是获取当前点击对象的值，通过byclassname获取，不要用Id的
要原生JS，不要JQ的，谢谢，可以追加赏金 展开
<span class="okdog" lay-id="user1">1只狗</span><span class="okdog" lay-id="user2">2只狗</span><span class="okdog" lay-id="user3">3只狗</span><span class="okdog" lay-id="user4">4只狗</span><span class="okdog" lay-id="user5">5只狗</span>
<div id="showdog">输出结果</div>
<script>
</script>
</body>
有若干个class对象，点击其中任意一个，返回它的值，比如点击第二个span，就返回2只狗，就是获取当前点击对象的值，通过byclassname获取，不要用Id的
要原生JS，不要JQ的，谢谢，可以追加赏金 展开
4个回答
展开全部
代码 请收下~~~~
<body>
<span class="okdog" lay-id="user1">1只狗</span><span class="okdog" lay-id="user2">2只狗</span><span class="okdog" lay-id="user3">3只狗</span><span class="okdog" lay-id="user4">4只狗</span><span class="okdog" lay-id="user5">5只狗</span>
<div id="showdog">输出结果</div>
<script>
var res = document.getElementsByClassName('okdog');
for(var i=0;i<res.length;i++){
res[i].addEventListener('click',function(e){
alert(e.srcElement.innerHTML)
},false);
}
</script>
</body>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
支持H5特性的浏览器都有这么一个原生函数querySelector和querySelectorAll
document.querySelectorAll('.okdog').forEach(function(o) {
o.addEventListener('click', function() {
document.querySelector('#showdog').innerHTML = o.innerHTML;
});
});若要兼容低版本浏览器，可以用document.getElementsByTagName('*')获取所有元素，然后去遍历每个元素，去比较类名。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
var okdogs = document.getElementsByClassName('okdog');
for( let i =0; i<okdogs.length; i++){
okdogs[i].onclick = function(){
var txt = this.innerText;
//事件处理
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
以下代码考虑到兼容性问题
// 根据class获取元素
function getElementByClass(sClass) {
var arr = [];
if ( document.querySelectorAll ) {
arr = document.querySelectorAll(sClass);
} else {
var elements = document.getElementsByTagName('*');
for(var i = 0; i < elements.length; i++) {
if(elements[i].className === sClass) {
arr.push(elements[i]);
}
}
}
return arr;
}
// 事件处理函数
var eventHandle = function(e) {
var target = e.target || e.srcElement;
document.getElementById('showdog').innerHTML = target.innerHTML;
}
// 获取元素并绑定事件
var dogs = getElementByClass('.okdog');
for (var i = 0; i < dogs.length; i++ ) {
var o = dogs[i];
if ( o.addEventListener ) {
o.addEventListener( 'click', eventHandle, false );
} else if ( o.attachEvent ) {
o.attachEvent( 'onclick', eventHandle );
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
