jquery知识点

1、如何将DOM对象装化为jquery对象

var span = document.getElementsByTagName("span")[0];       —返回DOM对象
var span = $(span);                       —直接将DOM对象转换为jquery对象

 

 

2、如何将jquery对象转化为DOM对象

var span = $("p span")[0];
等价于：
var span = $("p span").get(0);

 

 

3、修改某个元素的样式 ————jquery对象.css("样式名称", "样式值")

var span = $("p span").css("color", "red");

 

 

 

4、修改某个元素的属性————jquery对象.attr("属性名称", "属性值");

 

var img = $("p img").attr("src", "a.jpg"); 

 

 

5、jquery对象的方法

 

each(callback): 该方法实际上是JavaScript集合遍历的一种功能包装，它以jquery对象内的集合元素为遍历对象，并循环执行指定的函数。在循环体内的函数中，this关键字都会自动指向当前元素，且会自动向函数内传递元素的索引值（从0开始）

案例： 获取文档中的所有span元素，并为每个span元素定义字体大小

<div><span>文本块1</span></div>
<p><span>文本块2</span></p>

var spans = $("span");
spans.each(function(n){
     this.style.fontSize = (n+1)*12 + "px";  ————注意，在循环体内当前的对象是DOM对象，并非jquery对象
});

 

 

如果循环体内要想调用jquery对象的方法，必须要将DOM对象转换为jquery对象，具体代码如下：

var spans = $("span");
spans.each(function(n){
      $(this).css("font-size", (n+1)*12 + "px");
});

 

 

 

size()和length：均返回jquery对象中元素的个数

 

get()：该方法将jquery对象转换为DOM中元素的集合

 

get(index)：该方法与get()功能相同，但是它是能够获取指定索引值得元素对象（注：返回的也是DOM对象）

 

index(subject)：该方法用于获取jquery对象中指定元素的索引值，如果找到了匹配的元素，从0开始返回；如果没有找到匹配元素，则返回-1