본문으로 바로가기

IT & 기타/자바스크립트

해당되는 글 19
  • thumbnail
    IT & 기타/자바스크립트 (2)

    [Javascript] 자바스크립트로 Select 옵션 재설정/변경하기

    셀렉트(Select) 박스의 옵션을 재설정하고 싶은 경우 자바스크립트나 jQuery를 사용하여 옵션값을 변경할 수 있습니다. 이 글에서는 자바스크립트와 jQuery를 사용하여 Select 옵션값을 변경하는 방법에 대해 살펴보고, 예시를 통해 이를 워드프레스에 응용하는 방법에 대해서도 간단히 살펴봅니다. 자바스크립트로 Select 옵션 재설정/변경하기 Javascript로 셀렉트 박스의 옵션을 비우고 다른 값으로 교체하려는 경우 다음과 같은 코드를 사용할 수 있습니다. var list = ["AB", "BC", "MB", "NB", "NL", "NT", "NS", "NU", "ON", "PE", "QC", "SK", "YT"]; populateCombo(emptyCombo(document.querySele..
  • thumbnail
    IT & 기타/자바스크립트 (2)

    자바스크립트: 클래스가 있는지 체크하기

    자바스크립트(JavaScript)에서 특정 클래스가 있는 경우에 실행되도록 스크립트를 만들고 싶은 경우에 참고해보세요. 자바스크립트: 클래스가 있는지 체크하기 예를 들어, mobile 클래스가 존재하는 경우에 팝업을 표시하는 경우를 생각해볼 수 있습니다. 그러면 다음과 같은 스크립트를 사용할 수 있습니다. var isMobileVersion = document.getElementsByClassName('mobile'); if (isMobileVersion.length > 0) { // elements with class "mobile" exist } getElementsByClassName는 배열과 유사한 개체(array-like object)인 NodeList를 반환한다고 합니다. 그 길이를 체크하여 ..
  • thumbnail
    IT & 기타/자바스크립트 (3)

    자바스크립트: 숫자 천 단위마다 콤마를 찍는 방법

    자바스크립트를 사용하여 숫자 천 단위마다 콤마를 찍는 방법 중 하나입니다. 다양한 방법이 있으므로 상황에 맞는 스크립트를 선택하여 사용하시면 될 것 같습니다. 자바스크립트: 숫자 천 단위마다 콤마를 찍는 방법 정수에 천 단위마다 콤마를 넣는 JavaScript 함수: 예시: function thousands_separators(num) { var num_parts = num.toString().split("."); num_parts[0] = num_parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ","); return num_parts.join("."); } console.log(thousands_separators(1000)); console.log(thousands_sepa..
  • thumbnail
    IT & 기타/자바스크립트 (2)

    이미지 가로 세로 크기 동일하게 만드는 방법 (정사각형)

    화면 크기가 달라져도 이미지의 가로 크기와 세로 길이가 동일하게 유지되도록 하고 싶은 CSS나 자바스크립트로 시도해볼 수 있습니다. 이미지가 가로 세로 비율이 동일하게 유지하고 싶은 경우 아래의 방법을 테스트해보시기 바랍니다. CSS를 사용하여 이미지 종횡비 (Aspect Ratio) 유지하기 이미지 크기가 변해도 종횡비 (예: 4:3, 16:9)를 유지하고 싶은 경우, 혹은 가로 세로 크기를 동일하게 유지하고 싶은 경우 W3Schools 문서를 참고해보시기 바랍니다. How To - Aspect Ratio / Height Equal to Width How TO - Aspect Ratio Learn how to maintain the aspect ratio of an element with CSS. As..
  • thumbnail
    IT & 기타/자바스크립트 (6)

    화면을 아래로 스크롤할 때 상단 메뉴를 고정하는 방법 (자바스크립트)

    화면을 스크롤할 때 상단 메뉴를 고정하고 싶은 경우가 있습니다. 이 경우 구글을 검색하면 다양한 자료를 찾을 수 있습니다. 자바스크립트를 사용하여 화면을 아래로 스크롤할 때 상단 메뉴를 고정하기 이 티스토리 블로그에는 최근 공개된 Book Club (북 클럽) 이라는 스킨이 적용되어 있습니다. 북 클럽 스킨에서는 화면을 아래로 스크롤할 때 메뉴가 상단에 고정되지 않습니다. 현재 이 블로그에서는 w3schools.com에서 제공하는 코드를 사용하여 화면을 아래로 스크롤할 때 메뉴를 고정하도록 만들었습니다. 스킨의 제약 때문에 조금 엉성하지만 개인용 블로그이기 때문에 그냥 사용해도 무방할 것 같습니다. 소스는 다음 문서에 나와 있습니다. (업데이트: 이 글을 작성한 이후에 스킨을 고래스킨으로 변경했습니다. ..
  • thumbnail
    IT & 기타/자바스크립트 (7)

    자바스크립트를 사용하여 DIV 위치 순서 변경하기 [자체 정리용]

    자바스크립트를 사용하여 DIV 위치 순서 변경하기 [자체 정리용] jQuery를 사용하면 쉽게 DIV의 위치를 변경할 수 있습니다. jQuery 대신 자바스크립트를 사용하고 싶은 경우 다음 Statckoverflow 글을 참고할 수 있습니다. Change div order in CSS or javascript (CSS 또는 자바스크립트로 Div 순서 변경) 예시: var content = document.getElementById('FeaturedContent'); var parent = content.parentNode; parent.insertBefore(content, parent.firstChild); DIV에 ID가 지정된 경우 위와 같이 document.getElementById를 사용하면 됩..

    가성비가 뛰어난 웹호스팅

    저렴하고 가성비 좋은 웹호스팅

    최근 댓글

    가성비적인 측면에서 괜찮은⋯ 💬워드프레스, 웹호스팅 정보를 제공하는 블로그 Avada 요가하구 비보북 너무 괜찮은⋯ 💬Hman 윈도우 11은 아직 사용해 보⋯ 💬空空(공공) 감사합니다. 다시 한번 차근⋯ 💬viator_min 사이트 속도가 느리면 SEO(검⋯ 💬워드프레스, 웹호스팅 정보를 제공하는 블로그 Avada

    워드프레스 시작 가이드

    워드프레스 시작하기