飞比寻常 (JOE) 生，简单，活，简单，生活，不简单！
JOE个人网站
JOE个人网站，不仅仅是一个网站，更像是一个展现自我的平台，致力于让朋友们都可以
有所感触，有所收获。
1、Jquery 操作属性
1、添加属性 ： $('p').attr('title','yellow');
2、添加多个属性 ： $('p').attr({'title':'这里是title的值','class':'red'});
3、获取属性 ： alert($('img').attr('tittle'));
4、删除属性 ： $('img').removeAttr('title');
2、Jquery 操作类
1、添加类 ： addClass : $('p').addClass('big red');
2、删除类 ： removeClass : $('p').removeClass('red');
3、切换类 ： toggleClass : $('p').toggleClass('red');//如果有这个类，变没；如果没有这个类，变有
4、判断类 ： hasClass : alert($('p').hasClass('red'));
3、Jquery 操作样式
1、设置样式 ： $('p').css('background','red');
2、设置多个样式 ：（注意：如果想font-size这样的属性，要加引号） ： $('p').css({'background':'red','font-size':'60px'});
3、获取样式 （注意：不能获取连写属性如 background） ： alert($('p').css('font-size'));
4、Jquery 创建节点
$('<b></b>')
$('<b>BBB</b>')
$('<b id='bid'>ccc</b>')
5、向父节点中追加节点
append(新的jquery对象)
$('body').append($ob);
=========================
var $i=$('<i>tttt</i>');
$('div:eq(1)').append($i);
appendTo 追加到
$i.appendTo($('div.eq(1)'));
6、向父节点中前置节点
prepend
var $i=$('<i>ttt</i>');
$('body').prepend($i);
prependTo
$i.prependTo($('body'));
7、同级前置节点
before
var $i=$('<i>ssss</i>');
$('div:eq(1)').before($i);//向第二个div前面添加节点
<div>1</div>
<div>2</div>
<div>3</div>
insertBefore
$i.insertBefore($('div:eq(1)'));
8、同级后置节点
after
var $i=$('<i>www</i>');
$('div:eq(1)').after($i); //向第二个div后面添加节点
<div>1</div>
<div>2</div>
<div>3</div>
insertAfter
$i.insertAfter($('div:eq(1)'));
1、clone 克隆节点
有1个参数 （true|false）真代表克隆原标签的事件，假代表不克隆事件；
如：
<script src='jquery.js'></script>
<script type="text/javascript" charset="utf-8">
$(function(){
$('div').on('click',function(){
alert(1);
});
var $c=$('div').clone(true);
$('body').append($c);
});
</script>
</head>
<body>
<div >BBB</div>
</body>
2、替换标签 replaceWith
$(obj).replaceWith('<b>aaaaaaa</b>'); //可以放置字符串
$(obj).replaceWith($('<b>aaaaaa</b>')); //也可以使用JQ的对象
$('<b>aaaaaaa</b>').replaceAll($('div'));
如：
<script type="text/javascript" charset="utf-8">
$(function(){
//$('div').replaceWith('<b>AAA</b>');
$('div').replaceWith($('<b>AAA</b>'));
});
</script>
</head>
<body>
<div >BBB</div>
--------------------------------------------------
<script type="text/javascript" charset="utf-8">
$(function(){
$('<b>AAAA</b>').replaceAll($('div'));
});
</script>
</head>
<body>
<div >BBB</div>
</body>
------------------------------------------------
3、包裹标签
$('p').wrap('<b></b>'); 用b标签包裹每个p标签；
$('p').wrapInner('<b></b>');在p标签里面包裹b标签；
$('p').wrapAll('<b></b>'); 用b标签包裹所有的p标签，(注意：如果p标签之间有其他标签，处理方式是将其他标签挤压出来，然后再包裹p);
如：
<script type="text/javascript" charset="utf-8">
$(function(){
$('p').wrap('<b></b>');
});
</script>
</head>
<body>
<p>BBBBB</p>
</body>
-------------------------------------------------
<script type="text/javascript" charset="utf-8">
$(function(){
$('p').wrapInner('<b></b>');
});
</script>
</head>
<body>
<p>BBBBB</p>
</body>
------------------------------------------------
<script type="text/javascript" charset="utf-8">
$(function(){
$('p').wrapAll('<b></b>');
});
</script>
</head>
<body>
<p>BBBBB</p>
<p>cccc</p>
<u>tttt</u>
<p>ssss</p>
</body>
--------------------------------------------------
4、遍历节点
children() //遍历所有子节点 var $c=$('div').children(); //找寻div下面所有的子节点；
$c.eq(1).css('background','red'); //子节点中选择第二个节点；
等效为：
var $c=$('div').children(':eq(1)');
parent() //寻找父节点 var $p=$('p:eq(1)').parent();
$p.css('background','red');
next //弟节点
prev //兄节点
siblings //获取除了自己的所有兄弟节点
var $p=$('p:eq(1)').siblings();
$p.css('background','red');
andSelf //包括自己
var $p=$('p:eq(1)').siblings().andSelf();
$p.css('background','red'); //找到所有兄弟节点后 包括了自己
$('div').children().andSelf().css('font-size','60px');
5、Jquery 中操作宽高
a、设置宽高
$('div').width('500px').height('500px');
$('div').width(500).height(500);
b、获取宽高
$('div').width();
$('div').height();
6、获取文档宽高
$(document).height();
$(document).width();
7、获取滚动条的高
var ish=$(document).scrollTop();
-------------------------------------------------
<script type="text/javascript" charset="utf-8">
$(function(){
$(document).bind('scroll',function(){
//1.获取浏览器的高
var iwh=$(window).height();
//2.获取文档的高
var idh=$(document).height();
//3.获取滚动条的偏移高度
var ish=$(document).scrollTop();
// alert(ish);
//4.判断
if((ish+iwh)==(idh)){
alert('到头了');
}
});
});
---------------------------------------------------
8、获取标签在整个浏览器中的偏移量
$('#did').offset().left //x轴
$('#did').offset().top //y轴
9、设置标签的定位
$('#did').offset({top:100,left:30});