jQuery를
jQuery를은 간단한 자바 스크립트 프로그래밍 할 수 있습니다, 경량 자바 스크립트 타사 라이브러리입니다.
jQuery를 선택
1, ID 선택 :
$("#id")
2, 태그 선택기 :
$("标签名")
3, 클래스 선택 :
$(".类名")
4 선택기를 정의 :
$("div.c1") // 找到有c1类的div标签
(5), 글로벌 선택 :
$("*") // 找到所有
6 선택기의 갯수 :
$("#id, .类名, 属性名")
도 7은, 선택기 레벨 : x와 y는 임의의 선택 일 수있다
$("x y") // x的所有后代y(子子孙孙)
$("x > y") // x的所有儿子y(儿子)
$("x + y") // 找到所有紧挨在x后面的y
$("x ~ y") // x之后所有的兄弟y
8, 선택 속성 :
$(input [type]) // 找到有type属性的input标签
$(input [type="text"]) // 找到type属性值为text的input标签
$(input [type="text"]) // 找到type属性值不为text的input标签
9 선택기 스크리닝 :
:first // 第一个
:last // 最后一个
:eq(index) // 索引等于index的那个元素
:even // 匹配所有索引值为偶数的元素,从 0 开始计数
:odd // 匹配所有索引值为奇数的元素,从 0 开始计数
:gt(index) // 匹配所有大于给定索引值的元素
:lt(index) // 匹配所有小于给定索引值的元素
:not(元素选择器) // 移除所有满足not条件的标签
:has(元素选择器) // 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)
예 :
$("div:has(h1)") // 找到所有后代中有h1标签的div标签
$("div:has(.c1)") // 找到所有后代中有c1样式类的div标签
$("li:not(.c1)") // 找到所有不包含c1样式类的li标签
$("li:not(:has(a))") // 找到所有后代中不含a标签的li标签
10 형태는 일반적으로 선별에서 사용될 :
:text // 筛选type是text的标签
:password // 筛选type是password的标签
:file // 筛选type是file的标签
:radio // 筛选type是radio的标签
:checkbox // 筛选type是checkbox的标签
:submit // 筛选type是submit的标签
:reset // 筛选type是reset的标签
:button // 筛选type是button的标签
등록 심사 양식 :
:enabled // 筛选出可用的input标签
:disabled // 筛选出不可用的input标签
:checked // 筛选出有checkbox选项被选中的input标签
:selected // 筛选出有select选项被选中的option标签
jQuery를 필터
JQuery와 오브젝트 소자의 선별 다음 1
jQuery对象.next() // 筛选出某jQuery对象下面的第一个元素
jQuery对象.nextAll() // 筛选出某jQuery对象下面的全部元素
jQuery对象.nextUntil("选择器") // 筛选出某jQuery对象下面的元素,直到遇到指定的元素为止
2, 상부 필터 소자의 jQuery 개체
jQuery对象.prev() // 筛选出某jQuery对象上面的第一个元素
jQuery对象.prevAll() // 筛选出某jQuery对象上面的全部元素
jQuery对象.prevUntil("选择器") // 筛选出某jQuery对象上面的元素,直到遇到指定的元素为止
(3) 상기 부모 구성 요소의 jQuery를 오브젝트의 스크리닝
jQuery对象.parent() // 筛选出某jQuery对象的父元素
jQuery对象.parents() // 筛选出某jQuery对象的全部父级元素
jQuery对象.parentsUntil("选择器") // 筛选出某jQuery对象的父级元素,直到遇到指定的元素为止
jQuery를 개체의 하위 요소 4, 스크리닝
jQuery对象.children() // 筛选出某jQuery对象的子元素
5 형제 JQuery와 개체를 스크리닝
jQuery对象.siblings() // 筛选出某jQuery对象的兄弟元素
조성물 및 스크리닝 방법에 사용 6
.find() // 从前面的jQuery对象中找出符合条件的元素
.first() // 获取匹配的第一个元素
.last() // 获取匹配的最后一个元素
.not() // 从匹配元素的集合中删除与指定表达式匹配的元素
.has() // 保留包含特定后代的元素,去掉那些不含有指定后代的元素。
jQuery를 라벨 작업
1, 레이블 스타일 작업
jQuery标签对象.addClass("类名") // 给标签添加CSS类名
jQuery标签对象.removeClass("类名") // 删除CSS类名
jQuery标签对象.hasClass("类名") // 判断是否有此CSS类
jQuery标签对象.toggleClass("类名") // 判断是否有此CSS类,有就删除,没有添加
2, 라벨 위치를 얻을 수
jQuery对象.offset() // 获取匹配元素在当前窗口的相对偏移或设置元素位置
jQuery对象.position() // 获取匹配元素相对父元素的偏移
jQuery对象.scrollTop() // 获取匹配元素相对滚动条顶部的偏移
jQuery对象.scrollLeft() // 获取匹配元素相对滚动条左侧的偏移
3, 라벨 크기를 얻을
jQuery对象.width() // 获取宽度
jQuery对象.height() // 获取高度
jQuery对象.innerWidth() // 获取内容宽度加padding宽度
jQuery对象.innerHeight() // 获取内容高度加padding高度
jQuery对象.outerWidth() // 获取内容宽度加padding宽度再加border宽度
jQuery对象.outerHeight() // 获取内容高度加padding高度再加border高度
4, HTML 코드의 동작을
jQuery对象.html() // 获取第一个匹配元素的html内容,要获取每个就遍历对象再获取
jQuery对象.html("新的内容") // 将匹配到的元素设置为新内容
5, 레이블 텍스트의 조작
jQuery对象.text() // 获取匹配元素的所有内容
jQuery对象.text("新内容") // 将匹配元素的所有内容设置为新内容
6 값 태그 값 연산
Query对象.val() // 获取第一个匹配元素的当前值
jQuery对象.val("value值") // 将匹配元素中有指定值的元素选中展示出来
jQuery对象.val(["value值1", "value值2"]) // 设置checkbox、select的值
도 7에서, 동작 속성 태그
jQuery对象.attr("属性名") // 获取匹配到的第一个元素的属性值
jQuery对象.attr("属性名","属性值") // 为匹配到的元素设置属性
jQuery对象.attr({"属性名1":"属性值1","属性名2":"属性值2"}) // 为匹配到的元素设置多个属性
jQuery对象.removeAttr("属性名") // 删除匹配元素中的一个属性
// 对于checkbox和radio使用下面的方法操作属性
.prop("属性名") // 获取属性值
.prop("属性名","属性值") // 设定属性
.removeProp("属性名") // 删除属性
jQuery를 문서 처리
1, 지정된 요소의 내측 앞에 새로운 HTML 코드를 추가
jQuery对象a.prepend(jQuery对象b) // 将对象b添加到对象a的前面
jQuery对象a.prependTo(jQuery对象b) // 将对象a添加到对象b的前面
2. 지정된 요소의 내부 후 새 HTML 코드를 추가
jQuery对象a.append(jQuery对象b) // 将对象b添加到对象a的后面
jQuery对象a.appendTo(jQuery对象b) // 将对象a添加到对象b的后面
3 지정된 요소의 외부의 앞에 새로운 HTML 코드를 추가합니다
jQuery对象a.before(jQuery对象b) // 将对象b添加到对象a的前面
jQuery对象a.insertBefore(jQuery对象b) // 将对象a添加到对象b的前面
지정된 외부 요소 뒤에 새 HTML 코드를 추가 4,
jQuery对象a.after(jQuery对象b) // 将对象b添加到对象a的后面
jQuery对象a.insertAfter(jQuery对象b) // 将对象a添加到对象b的后面
5, 삭제하고, 지정된 요소를 비 웁니다
jQuery对象.remove() // 删除元素本身以及内部的所有元素
jQuery对象.empty() // 清空元素内部的所有元素,不包含本身
(6) 대체 요소
jQuery对象.replaceWith(替换内容) // 将对象替换为新内容
替换内容.replaceAll(jQuery对象) // 用新内容替换对象
7 요소 복제
jQuery对象.clone() // 克隆一个新元素 有参数true,添加true带元素本身的事件也会克隆
jQuery를 이벤트
1, 공통 이벤트
click // 单击
dblclick // 双击
mouseenter // 鼠标移动到标签上
mouseleave // 鼠标离开标签
keydown // 按键被按下
keyup // 按键被松开
submit // submit按钮按下时
change // 表单的元素的值被改变时
focus // 当鼠标点击选中的元素或tab键定位元素时
blur // 当选中的元素失去焦点时
2 이벤트 바인딩
某标签.on(events,selector,function(){}) // events为事件 selector为选择器(特定条件下使用) function为事件要进行的函数
3, 이벤트 위임
이벤트 서브 부모 태그 라벨을 캡처하는 데 사용할 이벤트를 바인딩 상위 레이블을 추가하여 선택의 정의.
父级标签.on(events,要触发事件的标签,function(){})
(4) 상기 이벤트가 제거된다
某绑定过事件的标签.off(events)
5, 후속 이벤트의 구현을 방지하기 위해
return false; // 在事件执行函数结束后如过返回的是false则后续的事件不会执行。
6 페이지로드
$(document).ready(function(){ // 在这里写你的JS代码...
}) // 这个函数可以极大的提高web应用程序的响应速度,优化页面载入。
마지막으로, 나는 추천 프런트 엔드 학습 교환기 685 910 553 고급에 푸시 ( 프런트 엔드 정보 공유 ), 상관없이 당신이 지구에있는 어느 방향으로
당신은 당신이에 정착 몇 년 동안 작업에 오신 것을 환영합니다 여부를! (그룹 내에서 정기적으로 무료 학습 자료 및 얼굴 질문과 답변 문서 정돈 책의 주요 그룹의 일부의 무료 모음을 제공합니다!)
이 문서에 이의가있는 경우 문서에 코멘트에, 당신의 의견을 적어주세요.
이 문서가 흥미 경우, 공유 및 전달, 또는 당신이 볼 수하십시오, 당신은 인정하고 우리의 기사의 격려.
멀리 멀리 프로그래밍의 모든 사람이 도로를 바랍니다.