1.attr(name) function
<div id="app" value="zhaobaiyu">
1.var $app = $("#app").attr("value");
Returns the value of the first matching attribute, which returns zhaobaiyu
2. $app = $("#app").attr("name","wangying");
$app1 = $app.attr("name")
console.log($app1);
当attr("name1","value")
The role is to add an attribute with a value of value to the element
//attr() will report an error
2. prop();
1.prop("name");
name: the name of the attribute value to get
For example: $app = $("#app").attr();
var tex = $app.prop('value',"wangying");
2. <input type="text">
where the value of type can be
1.text input box
2.checkbox radio button
3.file
3.abslote
left
top
Refers to the parent element, the outermost layer is HTML
4.e = e || event
The distance of the xx coordinate from the left border is the distance from the left border of the parent container in IE
The distance from the yy coordinate to the upper border is the distance from the upper border of the parent container in IE
clientX distance from the left border
clientY distance from the upper bound
screenX distance from the left edge of the screen
screenY 距屏幕上边界的距离
pageX 距左边界的距离 IE8不支持
pageY 距上边界的距离 IE8不支持
offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 y 坐标。
oapp = document.getElementById("app")
oapp.onclick = function(e){
console.log(e.x);
console.log(e.clientX);
console.log(e.offsetX);
console.log(e.screenX)
}
Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用，函数不会在事件发生前被执行
3.e.target
返回当前被执行对象的dom对象。
5.files对象
1.js自带file 对象
var file = e.target.flies[0];
2.file.type
返回的是一个字符串
image/jpeg
3.split("/")
将字符串切成以"/”分开的数组，如果不传参会每个字符都变成一个数组的值
4.js Math 对象
属性：
E 返回算术常量 e，即自然对数的底数（约等于2.718）。
LN2 返回 2 的自然对数（约等于0.693）。
LN10 返回 10 的自然对数（约等于2.302）。
LOG2E 返回以 2 为底的 e 的对数（约等于 1.414）。
LOG10E 返回以 10 为底的 e 的对数（约等于0.434）。
PI 返回圆周率（约等于3.14159）。
SQRT1_2 返回返回 2 的平方根的倒数（约等于 0.707）。
SQRT2 返回 2 的平方根（约等于 1.414）。
方法：
abs(x) 返回数的绝对值。
acos(x) 返回数的反余弦值。
asin(x) 返回数的反正弦值。
atan(x) 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。
atan2(y,x) 返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。
ceil(x) 对数进行上舍入。
cos(x) 返回数的余弦。
exp(x) 返回 e 的指数。
floor(x) 对数进行下舍入。
log(x) 返回数的自然对数（底为e）。
max(x,y) 返回 x 和 y 中的最高值。
min(x,y) 返回 x 和 y 中的最低值。
pow(x,y) 返回 x 的 y 次幂。
random() 返回 0 ~ 1 之间的随机数。
round(x) 把数四舍五入为最接近的整数。
sin(x) 返回数的正弦。
sqrt(x) 返回数的平方根。
tan(x) 返回角的正切。
toSource() 返回该对象的源代码。
valueOf() 返回 Math 对象的原始值。
其中
.sqrt(x) 开平方
.sin(x) .tan(x) .cos(x) 正弦余弦
.random() 返回0~1 的随机数
.floor(x) 向下取整
.ceil(x) 向上取整
- .round(x) 四折五入比较常用
2.FileReader()
var reader = new FileReader();
建立一个新的 对象
5. $p1.filter("[title='橘子']").attr("name","lll")
引号套引号的时候外面的和里面的单双引号要分开，不然会报错
6.在页面中添加DOM节点
1.原生JS
1.$(function(){
var obtn = document.createElement("button");//创建一个按钮DOM元素 ，存在于内存中
obtn.innerHTML = "click";//向按钮中添加文本
document.body.appendChild(obtn);//插入这个dom元素
})
2.var odiv = document.createElement('div')//创建 div元素
document.body.appendChild(odiv);//向body里添加div元素这个document必须要有
var oh1 = document.createElement("h1");//创建H1元素
oh1.innerHTML = "真开心";//向h1里添加文本
odiv.appendChild(oh1);//向div里添加h1这个document不能有有就报错
2.jq
1. var str = '<li title="苹果">苹果</li>' 新建一个字符串
$(document.body).append(str); 将字符串插入到body里
jq支持将字符串append进入JQ节点。
2.$app = $("#app");找到app
var str = '<li title="苹果">苹果</li>' 创建字符串
$app.append(str); 添加li
$app.children().css("background", "red");给li 设置背景
3. $app = $("#app"); 寻找app对象
var $li = $('<li title="苹果">苹果</li>') 创建一个DOM元素 并且将其付给一个值
$app.append($li);插入APP里
4.$app = $("#app");
var $li = $('<li title="苹果">苹果</li>')
$li.appendTo($app);//将li插到app中
7. var $app = $("#app");//
$app.prepend('<li title="苹果">我是你爷爷</li>');//插入到父元素内部已有子元素之前
$app.append('<li title="苹果">我是你妈妈</li>');//插入到父元素内部已有子元素之后
$app.after('<p>呵呵，我是你爸爸</p>');//插入到app后面
$app.before('<p>呵呵，我是你奶奶</p>');//插入到app前面
8.remove()
$app.children().remove()； 删除dom节点
9.empty()
$app.empty();//清空子元素
10..css()用法
var $app = $("#app");
$app.css({
background:"red",
border:"1px solid red",
})
11.class操作
$("ul li:eq(1)").addClass("niub");//添加类
$("ul li:eq(1)").removeClass("niub");//删除类
$("ul li:eq(1)").toggleClass("niub");//类开关
$("ul li:eq(1)").toggleClass("niub")//有无类，返回一个布尔值
12 html（） text（）
一个当文本 一个当正常元素‘
13.val()
input 元素或得 属性值
14.width() height()
console.log($(".niub").width())//输出元素的宽结果200
$(".niub").width(300);//设置元素的宽
$(".niub").height();//返回元素的高
$(".niub").height(200);//设置元素的高
15.offset（） position()
console.log($("#div1").offset().left);//输出元素距body左边的距离
console.log($("#div1").offset().top);//输出元素距body上边的距离
console.log($("#div1").position().left);//输出元素距上一个已定位的元素的左边距
console.log($("#div1").position().top);//输出元素居上一个已定位元素的上边距
其中position（）不能传值但offset可以传值，结果可以重新定位元素
console.log($("#div1").offset({
top:50，
left:50
})
16.scrollTop();滚动条上下