您的位置：首页 > Web前端 > JQuery

jQuery的学习方便复习

2020-07-14 05:25 169 查看

jQuery摘要学习点

1.在HTML里使用标签

script

引入js文件

<script src="jQuery类库的路径"></script>
<script>
//使用jQuery
</script>

js对象转jQuery对象：
```
$(js对象)
```

jQuery对象转js对象：

jQuery对象[索引]

或者

jQuery对象.get(索引)

举例:

//1.1 用js方式获取d1对象--js对象：js对象不能直接使用jQuery对象的方法，但可以转换成jQuery对象再用：穿马甲 $(js对象)
var d1Js = document.getElementById("d1");
var inner = $(d1Js).html();
alert(inner);

//jquery对象都是类数组，数组里的每个元素都是js对象

//1.2 用jquery方式获取d1对象--jQuery对象：jQuery对象不能直接使用js对象的属性，但可以转换成js对象再用：脱马甲 jQuery对象[索引]
var d1Jq = $("#d1");
var inner = d1Jq[0].innerHTML;
alert(inner);

选择器

基本选择器：标签选择器：
```
$("div")
```
，获取所有div标签
ID选择器：
```
$("#d1")
```
，获取id为d1的标签
类选择器：
```
$(".cls")
```
，获取类名为cls的标签
并集选择器：
```
$("div, #d1, .cls")
```
三个选择器选中的结果，全部都要

层级选择器：

$("div span")

子选择器：
```
$("div>span")
```
，获取div的子元素span

属性选择器：

$("div[name]")

指定属性值的：
```
$("div[name='d1']")
```
，获取name属性值为d1的div元素
复合属性选择器：
```
$("div[属性1][属性2]...[属性n]")
```

基本过滤选择器

:first

最后一个：
```
:last
```
排除不要：
```
:not(selector)
```
索引为奇数的：
```
:odd
```
索引为偶数和：
```
:even
```
索引等于2的：
```
:eq(2)
```
索引小于2的：
```
:lt(2)
```
索引大于2的：
```
:gt(2)
```
所有标题：
```
:header
```
正在运动的动画：
```
:animated
```

表单属性选择器

:enabled

获取不可用的：
```
:disabled
```
获取被选中的radio/checkbox：
```
:checked
```
获取被选中的下拉选项option：
```
:selected
```

记住：基本选择器，表单属性选择器

其它的：练习一下（得有印象）。如果忘记了，可以查API

dom操作

操作标签体：
```
html()
```
：获取标签体
```
html(value)
```
：设置标签体。是覆盖式设置，设置的html代码会生效

操作文本：

text()

```
text(value)
```
：设置文本。是覆盖式设置，设置的html代码不生效

操作表单项的值：

val()

```
val(value)
```
：设置表单项的值

思考：如果有一个div，我要获取div里的内容，用什么方法？

val()

不行，应该使用

html() / text()

操作属性

方法	参数	描述
attr(name [,value])	name：属性名称	获取/设置属性值
prop(name [,value])		获取/设置属性值

如果要操作的是
```
checked
```
和
```
selected
```
属性，必须使用
```
prop()
```
方法
其它属性，优先使用
```
attr()
```
，如果不行，再使用
```
prop()
```

事件

js事件写法	jQuery事件写法
onclick 单击	click(fn)
ondblclick 双击	dblclick(fn)
onsubmit 表单提交	submit(fn)
onchange 域内容改变	change(fn)
onfocus 获取焦点	focus(fn)
onblur 失去焦点	blur(fn)
onkeydown 键盘按键按下	keydown(fn)
onkeypress 键盘按键按下、按住	keypress(fn)
onkeyup 键盘按键弹起	keyup(fn)
onmousedown 鼠标按键按下	mousedown(fn)
onmouseup 鼠标按键弹起	mouseup(fn)
onmouseover 鼠标移入	mouseover(fn)
onmouseout 鼠标移出	mouseout(fn)
onmousemove 鼠标移动	mousemove(fn)
onload 加载完成	$(fn) , $(document).ready(fn)

注意:
什么时候需要使用页面加载完成事件？

如果js功能代码，没有在页面的最后，而又需要在加载完成之后再执行：

建议把功能代码放到页面加载完成事件的响应行为里

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航