下面是我学习jQuery的一些笔记和今天学习Vue的笔记，发个帖记录一下
JQ特殊效果：
fadeIn(speed, callback) 淡入
fadeOut(speed, callback) 淡出
fadeToggle(speed, callback) 切换淡入淡出
fadeTo(speed, opacity, callack) 允许渐变为给定的不透明度（opacity设置透明度 0～1）
hide() 隐藏元素
show() 显示元素
toggle() 切换元素的可见状态
slideDown() 向下展开
slideUp() 向上卷起
slideToggle() 依次展开或卷起某个元素
（如果图片要用到卷起和展开，必须要设置宽和高）
stop() 阻止动画事件的排队机制，写在动画事件的前面（最好都要写这个）
链式调用：
query对象的方法会在执行完后返回这个jquery对象，所有jquery对象的方法可以连起来写
JQ属性操作：
（1）取出或设置html内容
变量 = 对象.html()
对象.html("写入内容")
（其实和JS中的innerHTML类型的用法）
（2）取出或设置某个属性的值
变量 = 对象.prop('属性名')
对象.prop({'属性名'：‘属性值’})
特殊：
获取value属性的简写方法：只有value有这种写法 对象.val()
给value设置内容，在小括号中书写 对象.val()
JQ事件：
blur() 元素失去焦点
focus() 元素获得焦点
click() 鼠标点击
mouseover() 鼠标进入（进入子元素也触发，一般不使用）
mouseout() 鼠标移出（离开子元素也触发，一般不使用）
mouseenter() 鼠标移入（进入子元素不触发）
mouseleave() 鼠标离开（离开子元素不触发）
hover() 同时为mouseenter和mouseleave事件指定处理函数，里面两个参数，第一个是移入函数，第二个是离开函数
（一般建议使用）
ready() DOM加载完成（即入口事件）
submit() 用户提交表单
change() 当下拉框发生改变就会触发此事件
焦点事件指的是文本框中的光标（让页面一进来就获取光标 直接调用 对象.focus() ）
提交事件必须要选择form标签才能用来提交事件，返回值为true可以提交，返回值为false不可以提交
表单验证的正则表达式：
正则书写规则：
（1）var re=new RegExp('规则', '可选参数')（一般不用）
*（2）var re=/规则/参数（建议使用）
转义字符匹配：
\d 匹配一个数字，即0-9
\D 匹配一个非数字，即除了0-9
\w 匹配一个单词字符（字母、数字、下划线）
\W 匹配任何非单词字符。等价于[^A-Za-z0-9_]
\s 匹配一个空白符
\S 匹配一个非空白符
\b 匹配单词边界
\B 匹配非单词边界
. 匹配一个任意字符
（基本正则匹配都是通用的）
修饰参数：
g：global，全文搜索，默认搜索到第一个结果停止
i：ingore，忽略大小写，默认大小写敏感
正则默认匹配规则：
匹配成功就结束，不会继续匹配，区分大小写
网页中正则匹配用法：
正则.test(字符串) 匹配成功就返回真，否则返回假
控制滚动条顶部的高度一直在输入的地方：
对象.scrolltop('99999999999999')
里面的无限大写，可以实现这种效果
使用键盘事件：
对象.keyup(functon(e){
(使用键盘事件，里面的函数一定要添加一个形参e，以便下面去判断键盘时使用)
if(e.keyCode == 数字){
（e.keycCode 可以感应键盘点击下去的数字，每个键代表不同的数字，可以通过alert(e.keyCode)测试每个键）
对象.click()
（如果前面写了某个对象的事件，在下面只需要直接写出这个这个事件而不用写出内部函数）
}
})
事件冒泡：
当子级和长辈都写了事件，当你触发子级的时候，会把事件冒泡到长辈身上，长辈也会触发当前的事件
（1）阻止事件冒泡
event.stopPropagation() （不建议使用）
（2）阻止表单提交
event.preventDefault() （不建议使用）
实际开发中，一般把阻止冒泡和阻止默认行为合并起来写，合并写法可以用，只需要在函数中写return false
return false有两个作用:
(1)阻止事件冒泡
(2)阻止表单提交
DOM操作：
对象.before(数据) 在元素外部的前面去添加数据，和对象是兄弟关系
对象.after(数据) 在元素外部后面添加数据，和对象是兄弟关系
对象.append(数据) 在元素内部后面添加数据，和对象是父子关系
对象.prepend(数据) 在元素内部前面添加数据，和对象是父子关系
对象.remove() 删除此标签
（如果添加节点的操作，里面是添加一个选择器的话，代表是剪切）
事件委托：
动态添加的节点是不能获取任何事件的，事件委托就是来解决这个事情的
（动态添加指的是在界面中手动去添加的）
$('父辈').delegate('要点击的元素'，‘事件名称’，functio(){要执行的程序})
注意：只要是父辈都可以，甚至是body，但一定是默认有的，不能是添加的
placeholder专门做提示文字的 ， 这是一个属性直接在input中写入此属性就可以 （HTML5有兼容问题，IE8以下的浏览器不支持的）
让某个效果一直动，只能使用定时器，一般连续循环走动的图片都是使用两张一样的图片
想要知道哪个标签的个数就以此标签为对象（对象.length）就能获取 注意：length后没有括号
想要知道某个对象有没有某个类（对象.is(".类名")）
Vue.js初体验
Vue.js是前端三大新框架：Angular.js、React.js、Vue.js之一，Vue.js目前的使用和关注程度在三大框架中稍微胜出，并且它的热度还在递增。
Vue模板语法
div就是vue的语法环境,一定要用div标签。id名字随意
<div id="app">
<!--两个大括号名字：胡子语法-->
<!--vue中胡子语法的作用：要在页面中输出内容;默认是找data里面的数据-->
<a href="#">{{ txt }}</a>
{{ num }}
</div>
<script type="text/javascript">
//通过实例化创建vue的对象
var vm = new Vue({
//绑定的那个id
el:'#app',
//自定义的属性。要往页面输出的内容，基本上都是写在data属性中
data:{
txt:'hello vue!!',
num:123
}
})
</script>
调用属性的时候，别用++--
胡子语法里面，带了单引号就是字符串，原样输出
三元运算符 ok?为真显示这里:为假就显示这里
{{ ok? 'A':'B' }}
Vue中的事件
<div id="app">
<h1> {{ num }} </h1>
<!--事件的完整写法：-->
<!--<input type="button" value="递增" v-on:click="num+=2" />-->
<!--事件的简写方法-->
<input type="button" value="递增" @click="num+=2" />
</div>
华丽的分割线-------------------------------------------------------------------------------------------------------------------
以上就是我这两天关于jQuery的笔记心得分享，有什么错误欢迎大家指出
|
|
收藏
淘帖
踩
