내용이 빈 태그 찾기 : jQuery(':empty')
페이지 정보
작성자 서방님 댓글 0건 조회 259회 작성일 16-06-15 10:04본문
자식요소가 없는 td 를 찾아서 'Was empty!' 라는 텍스트를 적어 넣습니다.
<!DOCTYPE html>
<html>
<head>
<style>
td { text-align:center; }
</style>
<script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
<table border="1">
<tr><td>TD #0</td><td></td></tr>
<tr><td>TD #2</td><td></td></tr>
<tr><td></td><td>TD#5</td></tr>
</table>
<script>$("td:empty").text("Was empty!").css('background', 'rgb(255,220,200)');</script>
</body>
</html>
미리보기
<iframe marginheight="0" src="http://cfs.tistory.com/custom/blog/68/684698/skin/images/4.27.1.html" frameborder="0" marginwidth="0" scrolling="no" style="box-sizing: border-box; max-width: 100%; width: 946px; height: 120px;"></iframe>
여기서 한가지 중요한 것은 <td></td> 와 <td> </td>(공백이 있음) 은 다릅니다. 즉 공백도 text 로 인식하여 자식요소가 있다고 판단하는 것이죠. 엔터키 또한 마찬가지 입니다. 어~ 텍스트 없는데 왜 빈 것으로 인식안해 라고 하심 안됩니다.~~
이 선택자의 사용법은 막상 사용할 때 혼란이 좀 올 수 있겠네요. '아우 왜~ 문자가 없는데 이게 선택이 안되지'라고 말이죠. 그럴때는 꼭 공백이나 엔터키가 들어가 있는지 확인해 보시는게 좋겠네요.
댓글목록
등록된 댓글이 없습니다.
