jquery는 입력 배경색을 설정합니다.-프런트엔드 Q&A-php.cn

jquery는 입력 배경색을 설정합니다.

PHPz

풀어 주다： 2023-05-28 13:16:40

원래의

856명이 탐색했습니다.

jQuery는 입력의 배경색 설정을 포함하여 HTML 요소를 작동하고 이벤트를 처리하는 편리한 방법을 제공하는 JavaScript 프레임워크입니다. 이 글에서는 jQuery에서 입력의 배경색을 설정하는 방법을 소개합니다.

먼저 HTML 페이지에 jQuery 라이브러리를 도입해야 합니다. 이는 태그에 다음 코드를 추가하여 달성할 수 있습니다.

<head>
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
</head>

로그인 후 복사

다음으로 jQuery에서 선택을 위해 배경색을 설정해야 하는 입력 요소에 id 속성을 추가합니다. 예를 들어 페이지에 입력 상자를 추가하고 "input1"이라는 ID를 지정할 수 있습니다.

<input type="text" id="input1" placeholder="请输入内容...">

로그인 후 복사

그런 다음 페이지가 로드된 후 jQuery의 Ready() 메서드를 사용하여 입력 상자를 가져오고 배경으로 설정할 수 있습니다. 색상. Ready() 메서드는 페이지의 모든 요소가 로드된 후에 실행됩니다. 다음은 구체적인 코드 구현입니다.

$(document).ready(function(){
  // 获取输入框元素
  var inputElement = $('#input1');
  
  // 设置背景色为红色
  inputElement.css('background-color', 'red');
});

로그인 후 복사

위 코드에서 먼저 $() 함수를 사용하여 입력 상자 요소를 얻은 다음 css() 메서드를 사용하여 배경색을 빨간색으로 설정합니다. 그 중 css() 메소드는 jQuery에서 CSS 속성을 설정하고 가져오는 데 사용되는 메소드입니다.

배경색 설정 외에도 다른 CSS 속성을 설정하여 요소의 스타일을 변경할 수도 있습니다. 예를 들어 글꼴 크기, 글꼴 색상, 테두리 등을 설정할 수 있습니다. 다음은 몇 가지 샘플 코드입니다.

// 设置字体大小为18px
inputElement.css('font-size', '18px');

// 设置字体颜色为绿色
inputElement.css('color', 'green');

// 设置边框为1px的黑色边框
inputElement.css('border', '1px solid black');

로그인 후 복사

결론적으로 jQuery를 사용하면 HTML 요소를 쉽게 조작하고 스타일을 변경할 수 있습니다. 이 소개가 여러분에게 도움이 되기를 바랍니다.

위 내용은 jquery는 입력 배경색을 설정합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!