什么？你还在用$().html()获取表单数据？

试想一下这个情形：
如果我想将一张表单的数据发送给服务端：

QQ截图20170327205250.png

新手可能通过DOM这种方式获取表单的数据：

var data = {
  title:$("#theTitle").val(),
  tech:getCheckbox(),
  type:$("#theType").val(),
  //各种input的值.....
}

function getCheckbox(){
  var result = []
  for(){
    //判断那堆复选框是不是被选中
  }
  return result
}

但是我可以告诉你，完全不需要这么做！
jQrery早已经帮我们把获取表单元素的方法封装好了：

jQuery.fn.extend({
    serialize: function() {
        return jQuery.param( this.serializeArray() );
    },
    serializeArray: function() {
        return this.map(function() {
            // Can add propHook for "elements" to filter or add form elements
            var elements = jQuery.prop( this, "elements" );
            return elements ? jQuery.makeArray( elements ) : this;
        })
        .filter(function() {
            var type = this.type;
            // Use .is(":disabled") so that fieldset[disabled] works
            return this.name && !jQuery( this ).is( ":disabled" ) &&
                rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&
                ( this.checked || !rcheckableType.test( type ) );
        })
        .map(function( i, elem ) {
            var val = jQuery( this ).val();

            return val == null ?
                null :
                jQuery.isArray( val ) ?
                    jQuery.map( val, function( val ) {
                        return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
                    }) :
                    { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
        }).get();
    }
});

当我们用$()创建一个jQuery<b>表单</b>对象时，可以直接调用这个2个方法，serialize()是获取表单get的url：

serialize()

serializeArray()直接将get获取的url转换成对象：

serializeArray()

多观察、多思考，站在前人的肩膀上！