jQuery中get()方法用法实例

jQuery中get()方法用法实例

1. get()方法基本用法

get()方法是jQuery中一个重要的方法，可以用于获取指定位置的元素，也可以用于获取所有元素的值。其基本语法如下：

$(selector).get(index);

其中，selector表示需要获取的元素的选择器，可以是class选择器、id选择器，也可以是元素选择器等；index是需要获取的元素的下标，如果不指定，则默认值为0。

例如，下面的代码表示获取页面上第一个button元素的值：

var val = $("button").get(0).value;

2. get()方法常用示例

示例一：获取列表中的第二个元素

假设我们有一个无序列表，需要获取其中第二个li元素。代码如下：

<ul>
  <li>第一个元素</li>
  <li>第二个元素</li>
  <li>第三个元素</li>
</ul>

我们可以使用get()方法获取指定位置的元素，示例代码如下：

var secondLi = $('li').get(1).innerHTML;

这样可以得到列表中第二个元素的内容为“第二个元素”。

示例二：获取所有表单元素的值

假设我们有一个表单，需要获取其中所有表单元素的值，代码如下：

<form>
  <input type="text" name="username" value="username" />
  <input type="password" name="password" value="password" />
  <textarea name="description"></textarea>
  <select>
    <option value="1">选项1</option>
    <option value="2">选项2</option>
    <option value="3">选项3</option>
  </select>
</form>

我们可以使用get()方法获取所有表单元素的值，示例代码如下：

var allValues = $('form :input').get().map(function(element) {
  return $(element).val();
});

这样可以得到一个包含所有表单元素值的数组，其中包括了文本框、密码框、文本域、下拉框等等所有表单元素。