게시물 a태그에 text가 없을 때 if문 적용안됨 채택완료
질문을 통해 게시물 목록을 사진처럼 만들었습니다.
글이 없을 때 border을 안나오도록 하려고 처음엔 a태그의 href 글자수를 확인하여 글자수가 0 일때 border가 안보이도록 하였는데 적용이 안됐습니다.
그래서 기존 css에 border을 없애고 a의 text에 글자수가 0이 아닐때 border이 나오도록 적용했는데 보시다시피 text가 없음에도 border가 뜹니다..
저는 글이 없을 땐 border-bottom이 안나오도록 하고싶은데 계속 코드를 바꿔도 적용이 안되서 어렵습니다..
혹시 제가 고쳐야할 부분을 알려주시거나 새 해결방법을 알려주시면 정말로 감사하겠습니다!
http://test10.dothome.co.kr/g5/bbs/board.php?bo_table=news
여기는 해당 사이트입니다.
아래는 제가 짠 코드입니다.
</p>
<p><script></p>
<p>jQuery(function(x) {</p>
<p> let bo_a = $(".td_news a");</p>
<p> let a_text = bo_a.prop("text");</p>
<p> let a_arr = a_text.length;</p>
<p> </p>
<p> console.log(a_arr);</p>
<p> </p>
<p> if (a_arr != 0) {</p>
<p> $(".td_news").css("border-bottom", "1px solid #c1c1c1");</p>
<p> }</p>
<p>});</p>
<p></script></p>
<p>답변 4개
</p>
<p>$('.bo_h2').each(function() { if($(this).children('a').text().trim().length == 0){ $(this).parent().css("border-bottom", "0px"); } })
더보기 클릭할떄마다 위 코드 이벤트 발생시켜주면 됩니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
두분 다 다르지만 좋은 코드를 알려주셔서 채택을 어떻게 할지 정말 고민했습니다 ㅜㅜ 그래서 먼저 적으신분께 드렸어요!! 두 분 다 정말 멋진 코드고 멋진 코드 알려주셔서 감사합니다!
댓글을 작성하려면 로그인이 필요합니다.
스크립트 대신 css 처리방법 입니다.
- 관련 스트립트 삭제
- /g5/theme/joanlabor/skin/board/news/style.css
</p>
<p>...</p>
<p>.news_left .td_news {margin: 50px 40px 0 0;}
.news_left .td_news:first-child {margin-top: 0;}</p>
<p> </p>
<p>/* ------------------------------- 추가 ------------------------------- */</p>
<p>.td_news { border-bottom: 1px solid rgb(193, 193, 193); }
.td_news:has(.bo_h2 a[href=""]) { border-bottom: 0 none; }</p>
<p>/* ------------------------------- 추가 ------------------------------- */</p>
<p> </p>
<p>.bo_img {
overflow: hidden;
max-width: 556px;
height: 822px;
}</p>
<p>...</p>
<p>답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인