제이쿼리 소개

1 개요 1. JQuery란 무엇인가요? JQuery는 JS 작업을 단순화하고 JS 기능을 확장하는 JavaScript 라이브러리입니다.

2. 분리 원칙 JQuery는 가져오기와 사용의 분리 원칙을 따릅니다. 즉, 를 사용하여 사용할 다른 태그를 만듭니다.

3. 기본 구문 $(selector).action(); HTML 요소를 가져오고 요소에 지정된 작업을 수행합니다.

두 개의 선택기 1. 기본 선택기 CSS 선택기와 마찬가지로 JQuery 기본 선택기는 태그, 카테고리 및 ID를 기반으로 HTML 요소를 선택합니다.

2. 결합 선택기 $(selector01,selector02,selectorN): 어떤 조건을 충족하는 요소의 컬렉션을 가져옵니다.

$(selector01selector02): 동시에 여러 조건을 충족하는 요소를 가져옵니다.

$(selector01 selector02): 첫 번째 조건을 만족하는 요소의 하위 요소 중 두 번째 조건을 만족하는 요소를 가져옵니다.

3. 속성 선택기 속성을 기반으로 요소를 선택합니다.

$("[attr]"): attr 속성이 있는 모든 요소를 가져옵니다.

$("[attr='value']"): 지정된 속성 값을 가진 모든 요소를 가져옵니다.

$("[attr!='value']"): 지정된 속성을 갖고 값이 지정된 값과 같지 않은 모든 요소를 가져옵니다.

$("[attr$='value']"): 지정된 속성을 갖고 값이 지정된 값으로 끝나는 모든 요소를 가져옵니다.

$("[attr^='value']"): 지정된 속성이 있고 해당 값이 지정된 값으로 시작하는 모든 요소를 가져옵니다.

4.$(this) 은 일반적으로 현재 개체, 즉 메서드의 호출자를 가져오기 위해 메서드 내에서 사용됩니다.

3가지 요소 연산 1. 요소 생성 $(" ") 객체를 생성할 때 JQuery에서 사용하는 HTML 태그는 태그의 시작 부분만 될 수 있거나 다음을 포함할 수도 있습니다. 시작과 끝&lt ;tag> 에 세부정보를 포함할 수도 있습니다(예:

content ). 不能够直接使用标签名创建对象，即$("tagName")不能创建对象，这一点不同于JavaScript。

不能够单独使用标签结束标识创建对象，即$(" ")不能创建对象。

2.获取内容 text()：设置或者返回所选元素的文本内容。

html()：设置或者返回所选元素的内容（包含HTML标签）。

val()：设置或者返回所选字段的值。

3.内部插入 append()：在结尾（后端）添加子元素。

prepend()：在开头（前端）添加子元素。

appendTo()：将操作对象作为子对象添加到参数对象结尾。

4.外部插入 before()：在前面添加兄弟元素。

after()：在后面添加兄弟素。

insertBefore()：在前面插入兄弟元素。

insertAfter()：在后面插入兄弟元素。

5.删除元素 remove()：删除自身及子元素。

empty()：删除子元素。

remove("根据基本选择器选择指定元素")：删除基本选择器中指定元素。

6.获取子元素 children()：获取全部子元素。

children("基本组合选择器")：获取具有自定标签与指定属性的子元素。

7.筛选 如果一个选择器返回的结果不是一个对象，而是多个对象构成的集合，可以使用以下方法获取集合中的指定对象：

eq(index)：获取集合中指定索引位置的对象，索引从0开始。

filter(":even")：获取集合中所有索引为奇数的对象。

filter(":odd")：获取集合中所有索引为偶数的对象。

slice(index)：获取索引大于指定值的对象。

slice(0,index)：获取索引小于指定值的对象。

not(selector)：选择指定对象以外的全部对象。

四 属性操作 attr("attrName")：获取属性值。

attr("attrName","attrValue")：修改属性值。

removeAttr("atrrName")：删除属性。

五 常用操作 遍历对象：$.each(obj,function(i,n))，i是索引，n是当前遍历子对象。

获取单选按钮与复选框的选择状态：$(this).is(":checked")。

六 常用标签及其操作 1.select ⑴增加选项 $(selector).options[index]=new Option(name,value);//按照索引增加$(selector).add(option,before);//按照指定位置增加 ⑵删除选项 $(selector).length=0;//全部删除$(selector).remove(index);//按索引删除 ⑶option option.index: 인덱스 속성 값을 설정하고 반환합니다.

option.text: 텍스트를 설정하고 반환합니다.

option.value: 값을 설정하고 반환합니다.

option.selected: 선택 상태(true/false)를 설정하고 반환합니다.