JavaWeb 学习笔记 day03
jQuery
jQuery 的属性操作
- html() 它可以设置和获取起始标签和结束标签中的内容。 跟 dom 属性 innerHTML 一样。
- text() 它可以设置和获取起始标签和结束标签中的文本。 跟 dom 属性 innerText 一样。
- val() 它可以设置和获取表单项的 value 属性值。 跟 dom 属性 value 一样
DOM 的增删改
-
内部插入: appendTo() a.appendTo(b) 把 a 插入到 b 子元素末尾,成为最后一个子元素
prependTo() a.prependTo(b) 把 a 插到 b 所有子元素前面,成为第一个子元素 -
外部插入: insertAfter() a.insertAfter(b) 得到 ba
insertBefore() a.insertBefore(b) 得到 ab -
替换: replaceWith() a.replaceWith(b) 用 b 替换掉 a
replaceAll() a.replaceAll(b) 用 a 替换掉所有 b -
删除: remove() a.remove(); 删除 a 标签
empty() a.empty(); 清空 a 标签里的内容
CSS 样式操作
- addClass() 添加样式
- removeClass() 删除样式
- toggleClass() 有就删除,没有就添加样式。
- offset() 获取和设置元素的坐标。
jQuery 动画
- 基本动画
show() 将隐藏的元素显示
hide() 将可见的元素隐藏。
toggle() 可见就隐藏,不可见就显示。
以上动画方法都可以添加参数: 1、第一个参数是动画 执行的时长,以毫秒为单位 2、第二个参数是动画的回调函数 (动画完成后自动调用的函数) - 淡入淡出动画 fadeIn() 淡入(慢慢可见)
fadeOut() 淡出(慢慢消失)
fadeTo() 在指定时长内慢慢的将透明度修改到指定的值。0 透明,1 完成可见,0.5 半透明 fadeToggle() 淡入/淡出 切换
jQuery 事件操作
- click() 它可以绑定单击事件,以及触发单击事件
- mouseover() 鼠标移入事件
- mouseout() 鼠标移出事件
- bind() 可以给元素一次性绑定一个或多个事件。
- one() 使用上跟 bind 一样。但是 one 方法绑定的事件只会响应一次。
- unbind() 跟 bind 方法相反的操作,解除事件的绑定
- live() 也是用来绑定事件。它可以用来绑定选择器匹配的所有元素的事件。哪怕这个元素是后面动态创建出 来的也有效
事件的冒泡
- 什么是事件的冒泡? 事件的冒泡是指,父子元素同时监听同一个事件。当触发子元素的事件的时候,同一个事件也被传递到了父元素的事件里去 响应。
- 那么如何阻止事件冒泡呢? 在子元素事件函数体内,return false; 可以阻止事件的冒泡传递。
javaScript 事件对象
- 事件对象,是封装有触发的事件信息的一个 javascript 对象。 我们重点关心的是怎么拿到这个 javascript 的事件对象。以及使用。
- 如何获取呢 javascript 事件对象呢? 在给元素绑定事件的时候,在事件的 function( event ) 参数列表中添加一个参数,这个参数名,我们习惯取名为 event。 这个 event 就是 javascript 传递参事件处理函数的事件对象。