jquery之属性操作

jQuery之属性操作

相信属性这个词对大家都不陌生。今天我就给大家简单地介绍一下JQuery一些属性的操作

属性一共分三大类

一.基本属性

1.attr
2.removeAttr
3.prop
4.removeprop

html代码

   <div id="box1">菜单</div>
<div id="box2" class="hezi">123</div>
<input type="checkbox" >
<p class="p1">456</p>

css代码

   #box1{
width: 100px;
height: 100px;
background: red;
}
#box2{
width: 100px;
height: 100px;
background: blue;
}

jQuery代码

     //设置或返回被选元素的属性值。
console.log($("#box1").attr("id")); //从每一个匹配的元素中删除一个属性
console.log($("#box2").removeAttr("class")); //选中复选框为true,没选中为false
$("input[type='checkbox']").prop("checked"); $("p").prop("class","p1"); //用来删除由.prop()方法设置的属性集
$("p").removeProp("class");

二.css类

1.addClass
2.removeClass
1.toggleClass

html代码

    <p></p>

jQuery代码

     //为每个匹配的元素添加指定的类名。
$("p").addClass("selected"); //一个或多个要添加到元素中的CSS类名请用空格分开
$("p").addClass("selected1 selected2"); //从所有匹配的元素中删除全部或者指定的类。
$("p").removeClass("selected"); //如果存在(不存在)就删除(添加)一个类。
$("p").toggleClass("selected");

三.HTML代码/文本/值

1.html
2.text
1.val

hHTML代码

    <p>1<span>2</span>3</p>
<input type="text" value="abc"/>

jQuery代码

    //取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。
console.log($("p").html()); //取得所有匹配元素的内容。
console.log($("p").text()); //获得匹配元素的当前值。
console.log($("input").val());

上面这些代码大家直接用就可以查看效果,希望对大家有所帮助。

上一篇:java实现随机验证码的图片


下一篇:.net dynamic动态加属性