Jquery的方法(二)

时间：2022-11-28 00:16:59

一、文档操作
1、html()和text()的区别

<div id="J_div"><b><i>我是谁</i></b></div>

var str1 = $("#J_div").html();

document.write(str1);

结果是：<b><i>我是谁</i></b>

<div id="J_div"><b><i>我是谁</i></b></div>

var str2 = $("#J_div").text();

document.write(str2);

结果是：我是谁

二、属性操作
1、attr()和prop()的区别
无论是勾选复选框还是取消复选框，当你用attr()方法获取复选框checked属性时，如果你没有给复选框设置checked属性，它都会返回undefined； 如果你给复选框设置了checked属性，它都会返回checked。
然而，当你用prop()方法获取复选框checked属性时，它会返回相应的实际勾选结果（选中，返回值为true；没选中，返回值为false）。
总之，浏览器用properties记录当前值，用attributes保存初始值。
温馨提示：
A、判断复选框是否选中，请用$jqobj.prop('checked')==true，不要用$jqobj.attr('checked',true)；
B、如果让复选框失效，不要想着通过给disabled属性设置true，false，enable，disabled值来实现，因为没用，你可以通过添加disabled属性，删除disabled属性来实现。

三、筛选过滤
1、index()和eq()的区别
index()参数可以是dom对象，jquery对象，字符串，返回值是元素的索引值(从0开始)，即指定元素相对于其他指定元素的index位置；
eq()参数只能是数字(从0开始)，返回值是对应下标的jq对象。
2、get()和eq()的区别
get()参数是数字(从0开始)，返回值是dom对象，可以接着使用js原生方法；
eq()参数是数字(从0开始)，返回值是jq对象，可以接着使用jq方法。

/**

 * 激活输入面板，获取焦点

 */

$('.choose-des-btn').get(0).addEventListener("click",function(){

  $('.content').hide();

  $('.choose-destination-window').show();

  $('#J_input_box').focus();

});

四、样式操作
1、width()和css('width')的区别

var $width = $('#box').width();

console.log($width);//

var csswidth = $('#box').css('width');

console.log(csswidth);//100px

两者都取到了指定宽度，不同的是.width()返回一个数字100，可以直接参与数值运算，而.css('width')返回了字符串100px。

2、css()和attr()的区别
attr()用来设置标签属性，css()用来设置标签样式。

五、事件
1、重置表单

document.getElementById("myForm").reset();//dom表单对象

$("#myForm")[0].reset();//jquery表单对象先转化为dom对象

2、序列化表单

params = $("#myForm").serialize();

//序列化的值可用于ajax请求的URL字符串中，比如a=1&b=2&c=3&d=4&e=5

3、click()，click(fn)，trigger('click',[data])的区别
$jqobj.click()和$jqobj.trigger('click')都可以触发点击事件，但是trigger可以带参数。
写一个点击图片验证码，验证码就刷新的事件，后面可以用$jqobj.trigger('click')在多处调用该事件。

4、去掉字符串首尾的空白字符

$.trim($("#uname").val());

相关文章