jQuery 能做什么？
jquery是一个丰富的js库，内部对js的很多复杂的方法进行了封装和加工，比如js很多方法名很冗长，jquery封装后方法就变得简便了，也考虑到了跨浏览器兼容问题，这样我们用js时需要考虑的很多问题它都帮我们解决了，这样我们使用时就比js代码要方便，高效的多。
jQuery 对象和 DOM 原生对象有什么区别？如何转化？
- 区别：
jquery对象通常用jquery的方法$(’’)来得到，可以使用jquery提供的方法来操作html的数据
DOM原生对象只能用js提供的方法，如getElementById，getElementByTagName,有的获取的是一个元素，有的获取的是一个数组。 - 转化方法：
普通dom对象转化成jq对象的方法
普通的dom对象的话只需要用$()包裹一下就好了
var yangchenjian=document.getElementById("yangchenjian"); // 原生获取
var $yangchenjian = $(yangchenjian)
‘$(yangchenjian) //这就算是把原生的转化成jq对象了经过转化jq封装好的api就可以正常使用了’
** jq对象转化成原生对象 **
通过jquery自身提供的.get[index] 这个方法来完成转化
var yangchenjian=document.getElementById("yangchenjian");
var $yangchenjian = $(yangchenjian) ;
var yangchenjian = $yangchenjian.get[0]; //完成原生转化
jQuery中如何绑定事件？bind、unbind、delegate、live、on、off都有什么作用？推荐使用哪种？使用on绑定事件使用事件代理的写法？
- jQuery中如何绑定事件
现在常用的事件代理方法是on方法，
on(events,[selector],[data],fn)
- events: 触发的事件类型 点击 双击 等等
- selector: 事件委托的时候用，用于过滤器的触发事件的选择器元素的后代
- data: 当一个事件被触发时要传递event.data给事件处理函数。
- fn: 用户触发后要做的事情是个函数方法
----------------------------下面写关于on的例子-------------------------------
$('p').on('click',function(){
alert('1234')
})
//阻止默认事件
$('from').on('submit',function(e){
e.stopPropagation();
})
//事件委托 只有ul内部中的li才能触发事件p标签是没有触发效果的
$(document).ready(function () {
function test(e) {
console.log($(this).text())
console.log(e.data.name)
}
$('.yu').on('click.la','li', {name: "杨晨健"},test)
})
</script>
<ul class="yu">
<li>hahha</li>
<li>ahdkada</li>
<li>dadada</li>
<p>adadadadadadada</p>
</ul>
//取消li中的触发事件
$('.yu').off('.la')
一定要注意应该是.事件名才行，别忘了带上‘.’
推荐使用on方法来完成事件绑定，同时应该记住 .off( events [, selector ] )方法用来对应on的绑定方法。注意：多个事件绑定的时候最好给触发事件取一个名字，这样解绑事件的时候不至于一下子全给解绑了 例子：node.on('click.eventname',function(){}) 解绑的时候就用node.off('.eventname'）
bind 早期的事件绑定方法，现在已经被弃用了，unbind是其对应的解绑事件的方法。
delegate(selector,[type],[data],fn) 用来执行事件委托（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。
live(type, [data], fn)，给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效，但是在1.7之后已经不被推荐使用了，如果想添加事件处理就用on方法就好，如果用的是老版本的jq就用delegate来代替live
jQuery 如何展示/隐藏元素？
show()方法完成元素的展示
hide()方法完成元素的隐藏
<script>
$('.show').on('click',function (){
$('p').show(100)
})
$('.hide').on('click',function () {
// body...
$('p').hide(100)
})
})
</script>
<ul class="yu">
<li>hahha</li>
<li>ahdkada</li>
<li>dadada</li>
<p>adadadadadadada</p>
</ul>
<button class="show">显示</button>
<button class="hide">隐藏</button>
</body>
</html>
jQuery 动画如何使用？
<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
button{
padding: 5px;
}
.block{
width: 50px;
height: 50px;
background-color: pink;
position: relative;
}
.clear{
clear: both;
}
</style>
</head>
<body>
<script>
$(document).ready(function () {
var block = $('.block')
var start = $('.start')
var stop = $('.stop')
var reset = $ ('.reset')
start.on('click',function () {
block.animate({
width:'200px',
height:'200px'
},1200,"swing",function () {
console.log('回调函数 ')
});
block.animate({
left:'400px',
},1200,"swing",function () {
console.log('👈移动 ')
});
block.animate({
left:'0px'
},1200,"swing",function () {
console.log(' 👉移动 ')
});
block.animate({
width:'50px',
height:'50px'
},1200,"swing",function () {
console.log(' 恢复啦 ')
});
})
reset.on('click',function () {
console.log('复位啦')
block.finish()
})
stop.on('click',function () {
console.log('停止了正在运行的动画')
block.stop(true,true)
})
})
</script>
<div class="block"></div>
<button class="start">动画开始</button>
<button class="stop">暂停</button>
<button class="reset">复位</button>
</body>
</html>
如何设置和获取元素内部 HTML 内容？如何设置和获取元素内部文本？
//获取元素内部HTML
$('selector').html()
//获取元素内部文本
$('selector').text()
//设置元素内部HTML
$('selector').html(' 内容放在里面 ')
//设置元素内部文本
$('selector').text(' 内容放在里面 ')
如何设置和获取表单用户输入或者选择的内容？如何设置和获取元素属性？
//设置表单的内容
$('selector').val('请输入您的账号')
//设置元素属性
$('selector').attr('name','野猪'):设置该元素中的name属性值为 野猪;
//获取用户输入内容
$('selector').val()
//获取元素属性
$('selector').attr('name'):获取该元素中的name属性;
