我们在用jQuery操作前端数据时，如何获取元素的值是最常见的使用场景之一。今天我就总结汇总一下jQuery获取元素的常见方法，包括根据ID获取元素内容，根据class获取元素内容，根据元素属性获取元素内容等方式，应该说基本上覆盖了我们在开发中常见的jQuery获取元素内容的场景，具体来看一下实例操作吧。

1.根据 id 查询（结果为单个对象）

// 堆代码 duidaima.com
// 原生 js 写法
var elementobj = document.getElementById("elementid");
// 原生 js 链式查询写法（注意：被查询的对象需为单个唯一对象，若为 list 则返回失败）
var elementobj2 = document.getElementById('direction').getElementsByTagName('span');

// JQuery 写法
var elementobj = $("#elementid");

2.根据类 class 名查询（结果为一组对象，需通过序号来指定单个对象）

// 原生 js 写法
var elementobjlist = document.getElementsByClassName("elementclassname");

// JQuery 写法
var elementobjlist = $(".elementclassname");

3.根据属性查询（两种写法结果不同）

// 原生 js 写法（若存在多个，仅返回第一个）
var elementobj = document.querySelector("div[dataid='elementdataid']");
// 原生 js 写法（返回一组元素 list）
var elementobjlist = document.querySelectorAll("div[dataid='elementdataid']");

// JQuery 写法（返回一组元素 list）
var elementobjlist = $("div[dataid='elementdataid']");

4.根据元素类型查询（结果为一组对象，需通过序号来指定单个对象）

// 原生 js 写法
var elementobjlist = document.getElementsByTagName('div');

// JQuery 写法
var elementobjlist = $('div');

5.复合查找（查询条件相同，返回均为一个 list）

// 堆代码 duidaima.com
// 原生 js 写法
    // 多个属性
var elementobjlist = document.querySelectorAll('input[type=radio][name=TestBtn]');
    // 类名
var elementobjlist = document.querySelectorAll('textarea[class="textareaclassname"]');
var elementobjlist = document.querySelectorAll('textarea.textareaclassname');
var elementobj0 = elementobjlist[0];
var elementobj1 = elementobjlist[1];

// JQuery 写法
    // 多个属性
var elementobjlist = $('input[type=radio][name=radioname]');
    // 类名
var elementobjlist = $("textarea[class='textareaclassname']"); // 查询全部包含类名 tbox_mutiLineBox 的 textarea 元素
var elementobjlist = $("textarea.textareaclassname");