码迷,mamicode.com
首页 > Web开发 > 详细

jquery中的属性

时间:2016-09-24 12:01:37      阅读:141      评论:0      收藏:0      [点我收藏+]

标签:

jQuery中的属性用于获取或设置元素的属性

1.attr(),获取或设置所有相匹配的元素的属性值;removeAttr("attr"),移除所有相匹配的元素的属性

//html
<img src="1.jpg" />

//jquery
$("img").attr("src")//"1.jpg"获取img的src属性值
$("img")attr({src:"2.jpg",alt:"this is a img"})//<img src="2.jpg" alt="this is a img"/> img的src值变为了"2.jpg",alt属性值变为了"this is a img"
$("img").removeAttr("alt")//<img src="2.jpg" /> 移除了img的alt属性,此时再次访问alt属性值会返回undefined。

 2.prop(),获取或设置相匹配的元素中第一个元素的属性值;removeprop("attr"),移除相匹配的元素中第一个元素的属性

//html
<p title="first">first</p>
<p title="last">last</p>

//jquery
$("p").prop("title","lucky")//<p title="lucky">first</p>只改变了第一个p的title值
$("p").attr("title","lucky")//<p title="lucky">first</p>,<p title="lucky">last</p>两个p的title值都改变了
$("p").removeProp("title")//<p>first</p>只移除了第一个p的title值
$("p").removeAttr("title","lucky")//<p>first</p>,<p>last</p>两个p的title值都移除了

 3.addClass(“”),给元素增加类名,即class的属性值;removeClass(""),移除元素的类名;toggleClass(“”)元素有该类名移除,没有该类名则增加

//html
<div class="box">box1</div>
<div class="two">box2</div>

//jquery
$("div").addClass("do")//<div class="box do">box1</div>,<div class="two do">box2</div>div元素都增加了do的类名
$("div").removeClass("do")//<div class="box">box1</div>,<div class="two">box2</div>div元素都移除了do的类名
$("div").toggleClass("box")//<div class="">box1</div>,<div class="two box">box2</div>第一个div移除了box类名,第二个div增加了box类名

 4.html(),获取或设置元素中的内容,包括html标签。等同于js中的innerHTML;text(),获取或改变元素标签中的文本内容。等同于js中的textContent;val()获取元素的value值,等同于js中的value

//html
<div class="box">box<p>it‘s a p</p></div>
<div class="text">text<p>it‘s a p</p></div>
<input type="text" value="text"/>

//jquery
//获取
$(".box").html()//“box it‘s a p”  div标签中的内容以html方式获取
$(".box").text()//“box <p>it‘s a p</p>” div标签中的内容以text方式获取
$("input[type=‘text‘]").val()//"text" 获取input元素中的value值
//设置
$(".box").html("<u>aaa</ul>")// "aaa" div标签中的内容以html格式显现
$(".text").text("<u>aaa</ul>")//<u>aaa</ul> div标签中的内容以html格式显现
$("input[type=‘text‘]").val("noval")//<input type="text" value="noval"/>将input元素中的value值改为了noval

 

jquery中的属性

标签:

原文地址:http://www.cnblogs.com/wuxiaoshang/p/5902828.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!