jQuery学习笔记

218 阅读1分钟

jQuery的一些主要功能知识点

1.获取元素

jQuery的基本设计思想和主要用法,就是选择某个网页元素,对其进行操作。

使用jQuery的第一步,往往是先获取这个元素。一般都是将一个字符串形式的选择器放进jQuery的构造函数(ps:jQuery不需要new,但是确实返回了一个新对象),然后得到被选中的元素。

//用法
$('#myId')//选择id为myId的网页元素
¥('.myClass'//选择class为myClass的网页元素

ps:获取元素之后返回的是一个对象,这个对象可以操作元素,又称jQuery对象。

2.链式操作是怎样的

链式操作,顾名思义,‘链式’。在选中网页元素之后对他进行一系列操作,所有操作可以链接在一起以链条一样的方式写出来。为什么可以连起来,因为每一步jQuery操作之后返回的都是一个jQuery对象。对象自然可以一直调用方法链式下去。

例如

$('.test')
.find('.child')
.addClass('blue')//给child类加上blue
.end()//回test类
.addClass('red')//给test类加上red

3.创建元素

创建元素很简单,直接把要创建的新元素传入jQuery构造函数

$('<p>Hello</p>')
$('<li class="new">new list item</li>')
$('ul').append('<li>list item</li>')

4.移动元素

思路:

1.移动元素本身

2.移动其他元素来使目标元素达到相对移动

//例:要把div移动到p后面
//思路1做法,把div移动到p后面,返回的是div
$('div').insertAfter($('p'));
//思路2做法:把p移动到div前,返回的也是p
$('p').after($('div'));
//四对方法类似
insertAfter() vs after()
insertBefore() vs before()
appendTo() vs append()//后
prependTo() vs prepend()//前

5.修改元素的属性

常见的取值和赋值函数如下:

.html() 取出或设置html内容
.text() 取出或设置text内容
.attr() 取出或设置某个属性的值
.width() 取出或设置某个元素的宽度
.height() 取出或设置某个元素的高度
.val() 取出某个表单元素的值

又取值,又赋值,但是用的都是同个函数,如何区分呢?

用到了重载的思想。

当arguments.length取到2时,就是赋值操作;为1时,就是取值操作