<!DOCTYPE html><html><head><metacharset="UTF-8"><scripttype="text/javascript"src="js/jquery-3.5.1.min.js"></script><scripttype="text/javascript"src="js/attributeselector.js"></script><title>Insert title here</title></head><body><inputtype="text"value="id 입력"><inputtype="password"value="비밀번호" ><inputtype="radio" ><inputtype="checkbox"><inputtype="file" ></body></html>
JS
/**
*
*/
$(document).ready(function(){
//input태그의 type속성의 값이 text와 같은걸 선택해서 배경색을 빨간색
$("[type='text']").css("backgroundColor","red")
//input태그의 type속성의 값이 text와 같지 않은걸 선택해서 배경색을 빨간색으로 만들어라
$("[type!='text']").css("backgroundColor","red")
//input태그의 type 속성의 값이 word로 끝나는 모든 태그를 선택해서 배경색을 빨간색으로 만들어라
$("[type$='word']").css("backgroundColor","red")
$("[type|='pass']").css("backgroundColor","red")
//input태그의 value속성의 값이 id이거나 id로 시작하는 모든 태그를 선택해 빨간색으로 하라
$("[value|='id']").css("backgroundColor","red")
//input태그의 value속성의 값이 id로 시작하는 모든 태그를 배경색을 빨간색
$("[value^='id']").css("backgroundColor","red")
//input태그의 value속성의 값이 특정단어인 입력을 포함하는 모든 태그를 선택해서 배경색을빨간색
$("[value~='입력']").css("backgroundColor","red")
//input태그의 value속성의 값이 입력을 포함하는 모든 태그를 선ㅌ개해서 배경색을 빨간색으로
$("[value*='입력']").css("backgroundColor","red")
//input태그의 type속성의 값이 text인 것을 선택하여 배경색을 빨간색으로 적용하는 css를 적용하고,
//text입력란에 value속성에 abcd라는 값을 적용하여 기본값을 셋팅 (setter)
$("[type='text]").css("backgroundColor","red").val("abcd")
//그럼 text에 value(abcd)값이 들어가게됨 보이지는 않지만 setter역할을함
//input 태그의 type속성의 값이 password인것을 선택하고 password입력란에 적용되어있는
//value값을 가져와라(getter)
var value=$("[type='password']").val();
//alert(value);
//괄호안이 비어져있으면 getter역할을함 html에서 value를 가지고옴
//javascript통해서 서버통신이 되어야하는데 그때 이 val을 통해서 값을 가져옴
})