1 : jQuery 속성 작업
1 : 요소 prop ()의 고유 속성 값 설정 또는 가져 오기
//1. 获取属性语法
prop(''属性'');
//2. 设置属性语法
prop(''属性'', ''属性值'');
2 : 요소 사용자 정의 속성 값 attr () 설정 또는 가져 오기
//1. 获取属性语法
attr(''属性'');
//2. 设置属性语法
attr(''属性'', ''属性值''); // 类似原生 setAttribute()
이 메서드는 H5 사용자 지정 속성을 가져올 수도 있습니다.
3 : 데이터 캐시 data ()
data () 메서드는 DOM 요소 구조를 수정하지 않고도 지정된 요소의 데이터에 액세스 할 수 있습니다. 페이지를 새로 고치면 이전에 저장된 모든 데이터가 제거됩니다.
//1. 附加数据语法
data(''name'',''value''); // 向被选元素附加数据
//2. 获取数据语法
date(''name''); // 向被选元素获取数据
동시에 HTML5 맞춤 속성 데이터 색인을 읽을 수도 있으며 결과는 숫자입니다.
2 : jQuery 콘텐츠 텍스트 값
1 : 공통 요소 콘텐츠 html () (기본 내부 HTML과 동일)
html() // 获取元素的内容
html(''内容'') // 设置元素的内容
2 : 일반 요소 텍스트 콘텐츠 text () (기본 innerText와 동일)
text(); // 获取元素的文本内容
text(''文本内容'') // 设置元素的文本内容
3 : val () 형식의 값 (원래 값과 동일)
val() // 获取表单的值
val(''内容'') // 设置表单的值
3 : jQuery 요소 작업
1 : 요소 트래버스
//方法一
$("div").each(function (index, domEle) {
xxx; })
- each () 메서드는 일치하는 각 요소를 반복합니다. 주로 DOM 처리를 사용합니다. 각각
- 내부 콜백 함수에는 2 개의 매개 변수가 있습니다. index는 각 요소의 색인 번호이고 demEle은 jquery 객체가 아닌 각 DOM 요소 객체입니다.
- 따라서 jquery 메서드를 사용하려면이 dom 요소를 jquery 객체 $ (domEle)로 변환해야합니다.
//方法二
$.each(object,function (index, element) {
xxx; })
- $ .each () 메서드는 모든 개체를 탐색하는 데 사용할 수 있습니다. 주로 배열, 객체와 같은 데이터 처리에 사용됩니다.
- 내부 함수에는 2 개의 매개 변수가 있습니다. index는 각 요소의 색인 번호입니다. 요소는 콘텐츠를 순회합니다.
2 : 요소 만들기
$('' '');
3 : 요소 추가
//内部添加
element.append(''内容'') //把内容放入匹配元素内部最后面,类似原生 appendChild。
element.prepend(''内容'') //把内容放入匹配元素内部最前面。
//外部添加
element.after(''内容'') // 把内容放入目标元素后面
element.before(''内容'') // 把内容放入目标元素前面
- 요소는 내부적으로 추가되며 생성 후 부모-자식 관계가 있습니다.
- 외부에서 요소를 추가하면 세대가 지나면 형제입니다.
4 : 요소 삭제
element.remove() // 删除匹配的元素(本身)
element.empty() // 删除匹配的元素集合中所有的子节点
element.html('''') // 清空匹配的元素内容
- remove는 요소 자체를 제거합니다.
- empt () 및 html ( '' '')은 동일하며 둘 다 요소 내부의 콘텐츠를 삭제할 수 있지만 html은 콘텐츠를 설정할 수도 있습니다.
4 : jQuery 크기
속성 | 기술 |
---|---|
너비 () / 높이 () | 일치하는 요소의 너비와 높이를 얻는 것은 너비 / 높이뿐입니다. |
innerWidth () / innerHieght () | 패딩을 포함하여 일치하는 요소의 너비와 높이를 가져옵니다. |
outerWidth () / outerHeight () | 패딩을 포함하여 일치하는 요소의 너비와 높이를 가져옵니다. |
outerWidth (true) / outerHeight (true) | 패딩, 보르 드, 여백을 포함하여 일치하는 요소의 너비와 높이를 가져옵니다. |
- 위의 매개 변수가 비어 있으면 해당 값을 가져오고 반환 된 값은 숫자입니다.
- 매개 변수가 숫자이면 해당 값을 수정하십시오.
- 매개 변수는 단위를 쓸 필요가 없습니다.
5 : jQuery 위치 연산
1 : offset () 요소 오프셋 설정 또는 가져 오기
- 문서에 상대적인 오프셋 좌표는 부모와 관련이 없습니다.
- 이 메서드에는 left 및 top 속성이 두 개 있습니다. offset (). top은 문서 상단으로부터의 거리를 가져 오는 데 사용되며 offset (). left는 문서의 왼쪽에서 거리를 가져 오는 데 사용됩니다.
- 요소의 오프셋을 설정할 수 있습니다. offset ({top : 10, left : 30});
- 문서의 거리를 기반으로하는 상위 상자 및 위치 지정
2 : position () 요소 오프셋 가져 오기
- 위치를 지정하는 상위에 상대적인 오프셋 좌표 상위 위치가 지정되지 않은 경우 문서가 우선합니다.
- 이 메서드에는 left 및 top 속성이 두 개 있습니다. position (). top은 위치 지정 부모의 맨 위에서 거리를 가져 오는 데 사용되며 position (). left는 위치 지정 부모의 왼쪽에서 거리를 가져 오는 데 사용됩니다.
- 이 방법은 설정이 아닌 획득 만 가능합니다.
3 : scrollTop () / scrollLeft () 롤링되는 요소의 머리와 왼쪽을 설정하거나 가져옵니다.
- scrollTop () 메서드는 선택한 요소의 스크롤 된 헤드를 설정하거나 반환합니다.
- 매개 변수 뒤에 획득이없는 경우 매개 변수가 단위가없는 숫자이면 헤드가 롤링되도록 설정합니다.