MelonPeach

1. jquery Selector [ :button ] - type이 button인 요소 선택 요소를 선택하는 선택자

 

문법


$(":button")

 

type가 button인 모든 요소를 선택합니다.

 

예를 들어

 

1. $('.a:button').css('color', 'red');

 

1. class가 a인 button의 색을 red로 변경


 

 

예제 코드


<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
	<head>
	 	<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
		<title>Home</title>
	</head>
	<script type="text/javascript">
    $(document).ready(function(){
      $(":button").css("font-style", "italic");
      $(".a:button").css("color", "red");
      $(".b:button").css("color", "gray");
      $(".c:text").css("color", "red");
    });
	</script>
	<body>
		<input type="button" value="버튼1" class="a">
		<input type="button" value="버튼2" class="a">
		<input type="button" value="버튼3" class="b">
		<input type="text" value="텍스트" class="c"> 
	</body>
</html>

 

[ $(":button").css("font-style", "italic");  ] 모든 버튼의 글자스타일을 이태릭체로 바꿉니다.

[ $(".a:button").css("color", "red"); ] class가 a이고 type이 button인 버튼의 글자색을 red로 바꿉니다.

[ $(".b:button").css("color", "gray"); ] class가 b이고 type이 button인 버튼의 글자색을 gray로 바꿉니다.

[ $(".c:text").css("color", "red"); ] class가 c이고 type이 text인 글자의 색을 red로 바꿉니다.


 

 

 

실행 테스트


실행테스트

 

이 글을 공유합시다

facebook twitter googleplus kakaostory naver