diff --git "a/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-10-06\347\254\254\344\270\200\350\212\202\350\257\276 JS\345\237\272\347\241\200 .md" "b/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-10-06\347\254\254\344\270\200\350\212\202\350\257\276 JS\345\237\272\347\241\200 .md" index c5cd9266ab326b9068466f559e62f6e5cc31e744..09c2243e8bbfe2b6e6c9bd49b61a585dd95361b1 100644 --- "a/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-10-06\347\254\254\344\270\200\350\212\202\350\257\276 JS\345\237\272\347\241\200 .md" +++ "b/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-10-06\347\254\254\344\270\200\350\212\202\350\257\276 JS\345\237\272\347\241\200 .md" @@ -46,7 +46,7 @@ alert("欢迎进入JavaScript编程的世界!"); HTML文件中: -``` +```html @@ -65,7 +65,7 @@ HTML文件中: ### 三、将JS脚本代码作为A标签的属性值 -``` +```html diff --git "a/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-11-23 \347\254\254\344\272\214\345\215\201\344\272\224\350\212\202\350\257\276 jQuery\344\272\213\344\273\266.md" "b/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-11-23 \347\254\254\344\272\214\345\215\201\344\272\224\350\212\202\350\257\276 jQuery\344\272\213\344\273\266.md" new file mode 100644 index 0000000000000000000000000000000000000000..7af4beb10069d8b6106e22a28a55b878c2376735 --- /dev/null +++ "b/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-11-23 \347\254\254\344\272\214\345\215\201\344\272\224\350\212\202\350\257\276 jQuery\344\272\213\344\273\266.md" @@ -0,0 +1,169 @@ +### 一,jQuery页面事件 + +#### 1,onload事件(多次调用只会执行最后一个) + +* 当页面所有DOM元素以及所有外部文件(图片、外部 CSS、外部JavaScript等)加载完成之后才会执行。这里的所有DOM元素,指的是HTML部分的代码 + +#### 2,ready事件(可多次调用) + +* 只要页面所有DOM元素加载完成就可以执行,不需要再等外部文件 (图片、外部CSS、外部JavaScript)加载完成 + + + + + +### 二,鼠标事件 + +| 事件 | 说明 | +| --------- | ------------ | +| click | 鼠标单击事件 | +| dblclick | 鼠标双击事件 | +| mouseover | 鼠标移入事件 | +| mouseout | 鼠标移出事件 | +| mousedown | 鼠标按下事件 | +| mouseup | 鼠标松开事件 | +| mousemove | 鼠标移动事件 | + + + + + +### 三,键盘事件 + +| 键盘事件 | 触发条件 | +| --------------- | ------------------------ | +| **==keydown==** | 某个键盘按键被按下 | +| **==keyup==** | 某个键盘按键被松开 | +| keypress | 某个键盘按键被按下并松开 | + + + +### 四,表单(焦点)事件 + +* 仅 **表单元素** 与 **超链接** 具有焦点事件 + +#### 1,==focus==;获取焦点时触发的事件 + +#### 2,==blur==;失去焦点时触发的事件 + +```js + + + + + + + Document + + + + + + + +``` + +#### 3,select + +```js + + + + + + + + +
+ + + + +``` + +#### **4. change** ;具有多个选项的表单元素 + +##### 1,触发条件 + +* 单选框选择某一项时 + +* 复选框选择某一项时 + +* 下拉菜单选择某一项时 + +```js + + + + + + + + +
+ + + +
+

+ + + +``` + + + + + +### 六,复合事件 + +#### 1,hover() + +* 该方法相当于mouseover与mouseout事件的组合 + +```js +$("li").hover(function() { + $("li").css("background", "gray"); + },function() { + $("li").css("background", "green"); + }); +``` + diff --git "a/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-11-24\347\254\254\344\272\214\345\215\201\345\205\255\350\212\202\350\257\276 Jquery\344\270\213.md" "b/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-11-24\347\254\254\344\272\214\345\215\201\345\205\255\350\212\202\350\257\276 Jquery\344\270\213.md" new file mode 100644 index 0000000000000000000000000000000000000000..84bf35a571009fe5d4ec0dd4ecb4e8cee835c7a6 --- /dev/null +++ "b/25-\346\235\250\344\270\260\345\215\216/\347\254\224\350\256\260/2022-11-24\347\254\254\344\272\214\345\215\201\345\205\255\350\212\202\350\257\276 Jquery\344\270\213.md" @@ -0,0 +1,128 @@ +### Jquery + +#### 一、绑定 + +##### 1、bind函数 + +``` +$('选择器').bind({"事件名称":匿名函数}) +``` + +例: + +```html + +``` + +##### 2、on函数 + +两个形参 + +```html +$('选择器').on('事件名称':匿名函数) +``` + +例: + +```html + +``` + +三个参数 + +``` +$(“父节点选择器”).on(“事件名称”,“孩子节点,即要绑定的元素”,匿名函数) +``` + +例: + +```html + +``` + +#### 二、解绑函数 + +##### 1、off() + +不带参时默认全部事件解绑 + +```html + +``` + +##### 2、unbind + +unbind方法只能解绑用jQuery的bind方法以及用jQuery方法注册的事件处理程序。 + +用法: + +- $("选择器").unbind():如果没有参数,则表示解绑该元素绑定的所有事件 +- $("选择器").unbind("事件名称"):解绑该元素绑定的某种事件。 +- $("选择器").unbind("事件名称","事件名称"):多个参数之间用逗号隔开,表示解绑多个事件。 + +#### 三、一次事件 + +##### 1、one() + +当前元素只触发一次该事件one(事件类型,function) + +```html + +``` + +#### 四、event + +当回调函数被触发后,它们的参数通常是一个事件对象event。 + +##### 1、event方法: + +- **preventDefault**:取消浏览器默认行为。 +- **stopPropagation**:阻止事件向上层元素传播。 + +```html + +``` +