库和框架的区别?
库是将代码集合成的一个产品,供程序员调用。
框架则是为解决一个(一类)问题而开发的产品,框架用户一般只需要使用框架提供的类或函数,即可实现全部功能。可以说,框架是库的升级版。
jquery是什么?
jQuery 是专精于简化 DOM, AJAX 与 Event 操作的 JavaScript 库。jQuery的兼容性好,API 友好,功能强大,与时俱进;他可以选择网页元素,改变结果集,对元素的操作有取值和赋值,移动,复制、删除和创建,还有工具方法,事件操作,特殊效果,AJAX
jquery 对象和 DOM 原生对象有什么区别?如何转化?
区别:
jQuery对象操作起来简单,代码量少,dom操作起来复杂,代码量多;
jquery对象只能调用jquery的方法,不能调用dom对象的方法;同理,dom对象也只能调用本身的方法,不能调用jQuery的方法
两者之间的转化
jquery-->dom
$('#btn')[0];
dom-->jquery
var btn=document.getElementById('btn');
$(btn)
jquery中绑定事件?bind、unbind、delegate、live、on、off都有什么作用?推荐使用哪种?使用on绑定事件使用事件代理的写法?
//绑定事件
$('.btn').on('click',function(){})
bind(),delegate(),live(),on()都可以绑定事件;
unbind(),off()用来解绑事件,off()不添加参数解绑所有事件
live()在1.7已被弃用,delegate()和bind()在3.0已被弃用;
绑定事件更推荐用on()
$('.ul').on('click','li',function(){//用on进行事件委托
//todo
})
jquery 展示/隐藏元素?
$('div').hide();
$('div').show();
$('btn').on('click',function(){
$('div').toggle();//点击后在显示和隐藏来回切换
$('div').toggle('display');//淡入淡出
})
jquery 动画
jQuery动画animate()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>t1</title>
<script src='http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js'></script>
<style>
.a {
width: 100px;
height: 100px ;
border: 1px solid red;
}
</style>
</head>
<body>
<div class='a'></div>
<a class='btn' href="javascript:void(0);">click</a>
<script>
$('.btn').on('click',function(){
$('div').animate({//有多个变量发生改变时,以对象的形式传递给animate
width: '50%',
height: 'toggle'
},1500,function(){//1500表示动画持续时间,function表示动画完成之后执行该函数
console.log('animation complete');
});
})
</script>
</body>
</html>
设置和获取元素内部 HTML 内容,内部文本
$('p').html('<b>hello</b>');//设置内容
$('p').html();//获取内容,注意不要加引号,加了引号就变为设置为空字符串
$('p').text('world');//设置内容
$('p').text();//获取内容
设置和获取表单用户输入或者选择的内容,设置和获取元素属性
$('input').val();
$('input').val('hello');
$('input').attr('placeholder','input here');
$('input').attr('placeholder');