jQuery杂项方法

data()方法

data()是获取或修改元素中自定义 data-* 属性值的方法

语法

$(selector).data(name) // 获取所选元素的data-name的值

$(selector).data(name,value) // 修改所选元素的data-name的值为value

实例

<div class="div" data-name="value"></div>

$('.div').data('name') // 获取值为value

$('.div').data('name','newValue') // 修改data-name的值为newValue

*注意修改data-name的值后并不会实时展现在dom中*

each()方法

each()方法是为每个匹配的元素定义需要运行的函数

语法

$(selector).each(function (index, ele){});

//index参数为当前元素的index;
//ele参数为当前元素,也可以使用this代替;

实例

<ul>
  <li></li>
  <li></li>
  <li></li>
</ul>

$('li').each(function (index, ele){
  if(index == 0){
    $(ele).text('ele1');
  } else {
    $(ele).text('ele');
  }
  });

  *结果*
  <ul>
    <li>ele1</li>
    <li>ele</li>
    <li>ele</li>
  </ul>

get()方法

使用index获取选择器的元素

语法

$(selector).get(index); // index为元素在选择器中的序号

实例

<ul>
  <li>ele0</li>
  <li>ele1</li>
  <li>ele2</li>
</ul>

console.log($('li').get(0)); // 控制台输出结果为: <li>ele0</li>

concole.log($('li').get(1)); // 控制台输出结果为: <li>ele1</li>

*注意* get()方法获取的是元素本身

index()方法

获取元素相对于选择器中的位置

语法

$(selector).index()

$(selector).index(ele) // ele为Dom元素或是jQuery选择器

实例

<ul>
  <li>ele0</li>
  <li id="ele1">ele1</li>
  <li>ele2</li>
</ul>

$('li').index(); // 默认获取选择器中第一个的index;结果为 0

var ele = getElementById("ele1"); // var ele = $("#ele1");
$('li').index(ele); // 结果为: 1

$.onConflict()方法

用于释放jQuery对于jQuery和$变量的控制权

语法

$.noConflict(); //释放$变量对jQuery的控制权

$.noConflict([removeAll]);

// removeAll为boolean值true,flase;当值为true时释放$和jQuery变量

实例

var j = $.noConflict();

var li = $('li');

//报错,提示$不是函数

var j = $.noConflict();

var li = jQuery('li');

var li = $('li');

//报错,提示jQuery和$不是函数

$.param()方法

序列化数组或对象,主要用于Ajax生成查询参数

语法

$.param()