반응형

Java Script/jQuery 9

[Java Script] jQuery / width, height, attr

잡담 1. width, heightjQuery의 width() 및 height() 메서드는 선택한 요소의 너비와 높이를 가져오거나 설정하는 데 사용됩니다.1. 너비 및 높이 가져오기:var width = $('#myElement').width();var height = $('#myElement').height();2. 너비 및 높이 설정하기:$('#myElement').width(300); // 너비를 300px로 설정$('#myElement').height(200); // 높이를 200px로 설정이 메서드들은 요소의 현재 너비와 높이를 가져오거나 설정하는 데 유용합니다. 요소의 크기를 동적으로 변경하고, 화면에 렌더링 되는 요소의 크기를 조정할 때 사용됩니다.  기본글자 ..

Java Script/jQuery 2024.05.01

[Java Script] jQuery/ radio, checkbox

잡담radio와 checkbox는 상당히 많이 사용하는 내용입니다. 예를 들면 설문조사할 때 radio버튼은 꼭 들어가고, 약관동의 같은 경우는 checkbox를 많이 사용합니다. 어렵지는 않지만 여러 가지 방법에 대한 예제가 있으니 참고하면 좋을 것 같습니다.  1. radiojQuery를 사용하여 라디오 버튼을 조작하려면 다음과 같이 할 수 있습니다. 클릭 See the Pen jQuery radio by 이현석 (@loxshqac-the-styleful) on CodePen. 위 코드는 라디오 버튼의 값을 가져오고, 특정 라디오 버튼을 선택하는 방법을 보여줍니다. 라디오 버튼은 동일한 name 속성을 가진 여러 요소 중 하나를 선택하는 데 사용됩니다. jQuery를 사용..

Java Script/jQuery 2024.04.30

[Java Script] jQuery / val, text, html

잡담jQuery 부분은 대부분 다 예제로 배울 예정입니다. 이번에 수업으로 nodejs 들어갔는데 블로그엔 아직 jQuery정리하고 있네요 조금 더 분발해보도록 하겠습니다. 잡담을 읽어주는 사람이 있을까 싶긴 하지만... 1. valjQuery의 val() 메서드는 입력 필드의 현재 값을 가져오거나 입력 필드의 값을 설정하는 데 사용됩니다. 이 메서드는 , , 와 같은 다양한 유형의 폼 요소에 적용할 수 있습니다.사용 방법은 다음과 같습니다:1. 값 가져오기:var value = $('#myInput').val(); 2. 값 설정하기:$('#myInput').val('새로운 값');이 메서드를 사용하면 폼 요소와 상호 작용이 간단해지며, 폼 유효성 검사, 데이터 검색 또는 조작과 같은 작업에 매우 편리합..

Java Script/jQuery 2024.04.30

[Java Script] jQuery 사용법

잡담밀린 수업내용을 다시 정리하려니까 많이 까먹어서 정확한 정보들을 제공할 수 있을지 걱정이 됩니다. Front-end 쪽에서는 JQuery를 시작했고, back-end 에선 java DB연결, Python fastApi 등을 하고 있는데요 언제 기능들이 합쳐질지 모르겠습니다. 오늘도 열심히 작성해 보도록 할게요.jQuery jQuery는 JavaScript를 더 쉽게 다룰 수 있도록 도와주는 JavaScript 라이브러리 중 하나입니다. 웹 개발에서 가장 널리 사용되는 라이브러리 중 하나이며, 다양한 웹 브라우저에서 일관된 방식으로 코드를 작성할 수 있도록 해줍니다.jQuery는 HTML 문서의 요소 선택, 이벤트 처리, 애니메이션 및 AJAX와 같은 다양한 기능을 단순화하고 추상화합니다. 이로써 개발..

Java Script/jQuery 2024.04.26

[Java Script] jQuery / even, odd, lt, gt, eq

잡담오늘도 예제를 통해서 even, odd, it, gt, eq에 대해서 알아보겠습니다. 따로 이론은 필요 없을 것 같아요. 1. even / oddjQuery에서 .even()및. odd() 메서드는 선택된 요소 집합에서 짝수 또는 홀수 인덱스를 가진 요소들을 선택하는 데 사용됩니다. 이들 메서드는 0부터 시작하는 인덱스를 기준으로 요소를 선택합니다. 리스트1-index:0 리스트2-index:1 리스트3-index:2 리스트4-index:3 리스트5-index:4 리스트6-index:5 리스트7-index:6 See the Pen jQuery even odd by 이현석 (@loxshqac-the-s..

Java Script/jQuery 2024.04.26

[Java Script] jQuery / prev, prevAll, prevUntil, next, nextAll, nextUntil, siblings

잡담앞서서 jquery에 children과 parent에 대해서 배워보았는데요, 비슷한 개념의 내용을 오늘 다룰 예정입니다. 이론을 설명하는 거보다 예제로 보는 것이 훨씬 이해하기 쉽기 때문에 대부분 예제로 대체될 거 같습니다. 1.prevjQuery의 .prev() 메서드는 선택한 요소의 이전 형제 요소를 선택하는 데 사용됩니다. 이 메서드는 DOM 트리에서 한 단계 위로 이동하여 선택한 요소의 이전 형제 요소를 찾습니다. 아래는 간단한 예제입니다. 리스트1 리스트2 리스트3 리스트4 리스트5 리스트6 리스트7 See the Pen jQuery prev by 이현석 (@loxshqac-the-style..

Java Script/jQuery 2024.04.26

[Java Script] jQuery / children, parent

잡담아직 날짜상으로는 봄인데 벌써 여름처럼 덥네요. 오늘 최고기온이 27도까지 올라갔습니다. UI 수업시간에 ajax를 통해서 jason 데이터들을 가져오는 작업들을 해봤는데 게시글 밀린 게 많아서.. 곧 올라가지 않을까 싶습니다. 오늘은 jquery의 기본 중에 children, parent를 배워보도록 하겠습니다. 1. childrenjQuery의 .children() 메서드는 선택한 요소의 모든 직계 자식 요소를 선택하는 데 사용됩니다. 이를 통해 DOM 트리를 아래로 탐색하여 선택한 요소의 즉시 자식 요소를 찾을 수 있습니다. 간단한 예제를 살펴보겠습니다.// 다음과 같은 HTML 구조가 있다고 가정해보겠습니다:/* 자식 1 자식 2 자식 3*/// 다음과 같이 부모 요소의 모든 ..

Java Script/jQuery 2024.04.26

[Java Script] jQuery / ready

잡담jQuery를 사용하다 보니까 JavaScript도 재밌어지고 Front-end 코딩이 눈에 보이는 코딩이다 보니 더 재미있게 만들고 있는 거 같습니다. 별거 아닌 것도 먼가 해낸 거 같고 그렇습니다. 오늘도 열심히 올려보겠습니다. Ready.ready() 함수는 jQuery에서 사용되는 이벤트 핸들러입니다. 이 함수는 문서 객체 모델(DOM)이 로드되었을 때 실행할 코드를 지정할 수 있습니다.HTML 문서가 완전히 로드되고 초기화된 후에 JavaScript 코드를 실행해야 할 때 유용합니다. 일반적으로 JavaScript 코드가 요소 끝에 위치하는 것이 좋은데, 이는 HTML 문서의 모든 요소가 로드된 후에 JavaScript 코드가 실행되기 때문입니다. 그러나 jQuery를 사용할 때..

Java Script/jQuery 2024.04.24

[Java Script] jQuery / CSS

CSSjQuery에서 . css() 메서드는 선택한 요소의 CSS 속성을 가져오거나 설정하는 데 사용됩니다. 이 메서드를 사용하면 JavaScript 코드에서 CSS를 동적으로 조작할 수 있습니다..css() 메서드는 다음과 같은 두 가지 방법으로 사용할 수 있습니다:CSS 속성 가져오기: 선택한 요소의 CSS 속성 값을 가져옵니다.CSS 속성 설정: 선택한 요소의 CSS 속성 값을 설정합니다.다음은 각각의 방법에 대한 설명입니다.CSS 속성 가져오기.css() 메서드를 사용하여 선택한 요소의 특정 CSS 속성 값을 가져올 수 있습니다. 이때 메서드에 가져오려는 CSS 속성 이름을 전달합니다.// 예: 'color' CSS 속성 값을 가져오기var color = $("p").css("..

Java Script/jQuery 2024.04.24
반응형