您的位置:首页 > Web前端 > JQuery

Jquery练习总结

2014-05-06 21:48 495 查看
标签里面直接写样式,无需分号和逗号;
#ul>li是紧跟的li,  #ul li 是ul下面是所有的li;
★★★★Jquery学习
window.load 必须全部执行完HTML才会执行scipt;
document.ready 只要把标签解析出来它就会执行script;
onload只执行一次,ready可以执行多个。
document.ready简写方法=$(function(){alert('我是简写版')});

--创建层
var dvobj=$('<div></div>');
//添加到body中;
$('body').append(dvobj);

append方法用来在元素的末尾追加元素(最后一个子节点)。增加元素末尾(儿子)
prepend,在元素的开始添加元素(第一个子节点)。增加元素开始(儿子)
after,在元素之后添加元素(添加兄弟)增加元素后面(兄弟)
before:在元素之前添加元素(添加兄弟)增加元素前面(兄弟)

//Jquery转换成DOM对象的方法
alert(inp[0].value); Jquery转换成DOM对象的方法
alert(inp.val());    Jquery获得text中的value值
1.可以使用索引,index;
2.可以使用get(index)的方法。alert(inp.get(0).value);

//DOM对象转换成Jquery对象
只要把DOM对象用$()包起来就OK了
var txtObj = document.getElementById('txt')
alert($(txtObj).val());

//div>p 就是找到div里面的p标签(div所有的子元素)
//div+p 就是根据div兄弟标签p; (div元素后的紧邻的兄弟元素)
//div~p 就是找到div下面的所有p标签(div元素后的所有兄弟)

//可以使用转移符把嵌套aa里面的单引号转移也就等于双引号
$('p:not(\'.aa\')').css('background', 'red');

//基本过滤选择器
:fitst 选取第一个元素
:last选取最后一个元素
:not() 选取除指定之外的元素
:even 偶数选择器
:odd 奇数选择器
:eq()选取指定索引的元素
:gt()选取大于指定索引的元素
:lt()选取小于指定索引的元素
:animated选取正在执行动画的元素

--内容选择器
contains()选择含有本文内容的元素
has()选择指定元素的元素; //就是找到里面包含标签的
empty这个层中什么都没有;
parent选取含有子元素或文本的元素

--
$();//括号中写的都是选择器,如果默认只用一个参数,就意味着在整个界面中找这个元素,
//如果写2个参数,在id为tb的table中寻找tr标签;$('tr',$('#tb'))
$('td',$(this));意思就是在这一行中找这个td

--js中添加元素
$('#chks').attr('checked',true);
//移动过来的时候有样式还有事件.移除多个事件用空格;
$(this).removeAttr('style').unbind('click mouseover').appendTo('#u2');

--$('br').replaceWith('<hr />');//把界面上所有的br全部替换成Hr标签;

--添加属性或者样式使用attr();  例如attr('class','myclass');
--添加样式addClass(); 判断样式是否存在 hasClass(); //切换样式toggleClass();

--background-repeat:no-repeat; 不平铺;
Math.abs()取绝对值,就是超出的字数;

--bind添加事件  ,unbind是移除事件;
$('btn').bind('click',function(){
alert('好好')
});

--hover进入事件合成
A:hover 进入a标签的时候触发。
--$()中方法第一个参数就是进去的事件,第二个参数是离开的事件;
$('#txt').hover(function(){
$(this).css();
},
function(){
$(this).css();
});

-- 图片随着鼠标移动而移动,必须要获取到document对象
$(document).mousemove(function (e) {
$('#im').css({'position':'absolute','left':e.pageX,'top':e.clientY});
});

--which属性可以获取鼠标左键右键的值;


//文本框内容高亮显示  用txt点selectRange这个方法传入一个开始的索引和结束的索引。
$.fn.selectRange = function (start, end) {
var curObj = $(this).get(0);
if (!curObj) return;
else if (curObj.setSelectionRange) {
curObj.focus(); curObj.setSelectionRange(start, end);
} /* WebKit */
else if (curObj.createTextRange) {
var range = curObj.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', start);
range.select();
} /* IE */
else if (curObj.selectionStart) {
curObj.selectionStart = start;
curObj.selectionEnd = end;
}
};
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: