jQuery属性-CSS内容-文档

引入

jQuery分别在head body引入
window.jQuery=window.$=jQuery jQuery(function(){}); = $(function(){});
jQuery对象和JS对象区别，转化:$("")[0]

jQuery属性操作

属性 attr获取/removeattr删除/设置

• .removeProp(name);

.attr("name|pro|key","val|fn");// 获取单个属性；设置多个属性
            $("div").attr({   //*可设置自定义属性*
                value: "val",
                id: "idval"
            })
.removeAttr(name);//删除属性
***********************************************************            
.prop(n|p|k,v|fn);//设置 获取**本地属性**
.removeProp(name);
//清空**本地属性**:元素属性=undefined；prop获取undefined;attr获取undefined；
//清空*自定义属性:prop 获取为 undefined ；attr获取存在；
*********************************************************
fn: function(ind,val){
	return"attrname";
}

类 添加/移除

.addClass(class|fn)
.removeClass([class|fn])
.toggleClass(class|fn[,sw]) //fn[,sw]?

HTML代码/文本/值 获取/修改

.html([val|fn])  .html("<span>替代所有内容&识别标签</span>");
.text([val|fn])  .text("<span>替代所有内容&不识别标签</span>");
.val([val|fn|arr])  $("input:text").val("赋值value");
**********text获取所有元素的text，html获取一个元素html********
$("div").html(function(ind,oldval){
	return"<span>"+ind+oldval+"替代所有内容&识别标签</span>";
});

jQuery CSS内容操作

style内容 获取/修改

$("div").css("border");//获取1个样式

$("div").css({ //设置多个样式 驼峰式写法
      width: "100px",
      height: "50px",
      border: "1px blue solid"
      backgroundImage:url(img/1.jpg)
})

位置 获取/修改(不带像素单位)

*********************获取offset视窗偏移值
.offset().left ;	  .offset().top//获取offset视窗偏移值
$("div").offset({left:100,top:100});//设置offset  自动添加:相对定位
*********************获取position对于父元素的偏移
.position().left ;	.position().top//获取position对于父元素的偏移
*********************scrollTop获取相对滚动条顶部的偏移
.scrollTop(100) //设置相对滚动条顶部的偏移**不带像素单位**
.scrollLeft(200])//获取匹配元素相对滚动条左部的偏移

尺寸 获取/设置

.width();			.height(val|fn(ind,olaval){});
.innerwidth(); 		.innerheight();//content+padding
.outwidth(); 		.outheight();//content+padding+border
.outwidth(true); 	.outheight(true);//content+padding+border+maigin

文档处理

内部插入

var ele = $("<div> </div>");//创建jQ dom元素
.append(ele|fn);	.appendTo();	//最后插入
.prepend(ele|fn);	prepengTo();	//最前插入

function fn(ind,oldhtml){
console.log("oldhtml");//被插入元素html
}

外部插入

a.after(ele|fn);		 //ele紧插入在a后(前)面	
a.insertafter(ele|fn);	 //a紧插入在ele后(前)面	
.before();				insertbefore();

function fn(ind){}

包裹*

a.warp(b); 		//复制一个b b包裹a
a.warpall(b);	//b>all a,其他同级元素在b外
a.warpinner(b);	//a>b>a.chlidren
******************************************
a.unwarp();		//移除a.parent

替换

a.repaceWith(val|fn);//val替换a
a.replaceAll(val|fn);//a替换val
********************************************
function fn(ind,oldhtml){}

删除

a.empty(); 					//清空a所有子节点
a.remove();	a.remove(b)		//删除a； 删除a中的b
a.detach([expr]);			//?

复制

.clone(false/true); // false复制元素 /true复制元素+事件