怎么获取某个元素的指定class

怎么获取某个元素的指定class,第1张

实现方法:在jquery代码中,首先使用attr()方法获取某元素的class,然后使用addClass()方法为另一个元素添加这个class,或者使用attr()方法为另一个元素的class赋值。下面进行实例演示:

1、新建一个HTML文件,输入如下的HTML结构。为了演示本问题,假设了一个带有背景色样式的A元素和一个红色的B元素,实现在点击按钮后将A元素的类样式(背景色)应用到B元素上。

<style>

red{color:red !important;} /红色css样式/

bg_green{background:#00cc00;} /背景色类样式/

</style>

<div id="test">

<div id="a" class="bg_green">A(我是bg_green类)</div>

<div id="b" class="red">B(我是red类)</div>

</div>

下面例子通过documentgetElementsByClassName("class1")获取所有同一class的元素,使用for循环把取得的div元素的值存入数组arr中,完成的代码如下:

运行结果,打印数组如下:

扩展资料:

js或jQuery获取html元素的值的常用方法:

例如:<div id="aa">值</div>

js写法:

alert(documentgetElementById('aa')innerHTML);

jQuery写法:

alert($('#aa')html());

说明如下:

innerHTML是取元素的内部html代码,此例中即div内部的所有html代码。

html()方法作用也是取dom节点的内部html内容,是jQuery中的函数方法。

很明显你的html结构是table,所以可以循环每个tr来做对应。

比如:

var arr=[];

$("table tr")each(function(){

var name=$(this)find("lable")attr("name") || "";

var val=$(this)find("input")val() || "";

arrpush({

name:name,

value:val

})

});

consolelog(arr);

arr就是个数组,也是你要的数据,当然你可根据自己的情况作调整

<p>这是一个段落。</p>

<p>这是一个段落。</p>

<p class="active k">这是一个段落。</p>

<p>这是一个段落。</p>

<p class="m active">这是一个段落。</p>

<p>这是一个段落。</p>

<script>

$(function(){

   $("p")each(function(i,o){

      if($(o)hasClass("active"))consolelog(i);

   });

});

</script>

// 你好

// 由于你的 <li> 是动态生成的,你在使用 $ajax 的时候也没有指定 同步加载

// 所以可能是先执行了下面的 $("aclick") 绑定事件了

// 在 <a> 还没有生成的时候,就对齐进行绑定,因此是无效的

// 而且你的 <li> 是根据选择结果动态生成的,建议把你的绑定事件写到

// $("#proList")append("<li>"); 之后

// 去掉最后一个 $(document)ready 给 button 赋值的代码

// 改动你的 success:function(){} 如下

$each(result, function() {

var proName = thisproName;

// 这里循环定义 li 标签

var li = $("<li><a class='aclick' href='javascript:void(0);'>"+proName +"<a></li>");

// 然后再对该标签进行 click 绑定

liclick(function(){

$("#ele8")val(proName);

$("#emample8")hide();

})

// 这里 append 一个已经带有 click 事件的 li 就OK了

$("#proList")append(li);

});

以上就是关于怎么获取某个元素的指定class全部的内容,包括:怎么获取某个元素的指定class、HTML5 js如何获取所有相同ID或class的元素、html 获取class名称一样的动态元素,并获取属性名和属性值,需要保留对应关系等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9734036.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-01
下一篇 2023-05-01

发表评论

登录后才能评论

评论列表(0条)

保存