if 문을 사용하여 div가 비어 있는지 확인
나는 만약 별도의 div가 비어 있다면 특정 div를 제거하려고 합니다.제가 사용하는 것은 다음과 같습니다.
$(document).ready(function () {
if ('#leftmenu:empty') {
$('#menuTitleWrapper').remove();
$('#middlemenu').css({ 'right': '0', 'position': 'absolute' });
$('#PageContent').css({ 'top': '30px', 'position': 'relative' });
}
});
가까운 것 같은데 #leftmenu가 비어있는 테스트할 코드를 어떻게 작성해야 할지 모르겠습니다.어떤 도움이든 감사합니다!
사용할 수 있습니다.
if( $('#leftmenu').is(':empty') ) {
// ...
아니면 부동산을 테스트하여 발견되었는지 확인할 수도 있습니다.
if( $('#leftmenu:empty').length ) {
// ...
비어 있으면 공백도 없다는 것을 의미합니다.공백이 있을 가능성이 있는 경우 내용의 길이를 사용하여 확인할 수 있습니다.
if( !$.trim( $('#leftmenu').html() ).length ) {
// ...
그것은 당신이 공허하다는 것을 의미하는 것에 달려 있습니다.
텍스트가 없는지 확인하는 방법(이를 통해 비어 있는 하위 요소를 사용할 수
if ($('#leftmenu').text() == '')
하위 요소 또는 텍스트가 없는지 확인하는 방법
if ($('#leftmenu').contents().length == 0)
아니면.
if ($('#leftmenu').html() == '')
빈 디브를 확인하는 간단한 데모를 원한다면 다음 링크를 사용해 보는 것이 좋습니다.
http://html-tuts.com/check-if-html-element-is-empty-or-has-children-tags/
다음은 몇 가지 간단한 예입니다.
CSS 사용
만약 당신의 div가 공백 없이 비어있다면, 당신은 CSS를 사용할 수 있습니다:
.someDiv:empty {
display: none;
}
안타깝게도 이전 형제 요소를 선택하는 CSS 선택기가 없습니다.다음 형제 요소에만 해당됩니다.x ~ y
.someDiv:empty ~ .anotherDiv {
display: none;
}
jQuery 사용
text() 함수를 사용하여 요소의 텍스트 길이 확인
if ( $('#leftmenu').text().length == 0 ) {
// length of text is 0
}
요소 내부에 자식 태그가 있는지 확인합니다.
if ( $('#leftmenu').children().length == 0 ) {
// div has no other tags inside it
}
공백이 있는 경우 빈 요소 확인합니다.
if ( $.trim( $('.someDiv').text() ).length == 0 ) {
// white-space trimmed, div is empty
}
다음과 같은 jQuery 기능을 확장할 수 있습니다.
확장:
(function($){
jQuery.fn.checkEmpty = function() {
return !$.trim(this.html()).length;
};
}(jQuery));
사용:
<div id="selector"></div>
if($("#selector").checkEmpty()){
console.log("Empty");
}else{
console.log("Not Empty");
}
또한 다음을 사용할 수 있습니다.
if (! $('#leftmenu').children().length > 0 ) {
// do something : e.x : remove a specific div
}
당신에게 효과가 있을 것 같아요!
사용해 보십시오.
$(document).ready(function() {
if ($('#leftmenu').html() === "") {
$('#menuTitleWrapper').remove();
$('#middlemenu').css({'right' : '0', 'position' : 'absolute'});
$('#PageContent').css({'top' : '30px', 'position' : 'relative'});
}
});
그것이 가장 예쁘지는 않지만, 효과가 있을 겁니다.내부가HTML(#leftmenu의 내용)은 빈 문자열입니다(즉, 내부에 아무것도 없음).
저는 오늘 이런 일을 겪었지만, 수락된 답변은 저에게 효과가 없었습니다.제가 한 방법은 이렇습니다.
if( $('#div-id *').length === 0 ) {
// your code here...
}
나의 솔루션은 div 내부에 요소가 있는지 확인하기 때문에 텍스트만 있으면 div를 빈 상태로 표시합니다.
저의 경우 document.ready에 숨길 요소가 여러 개 있었습니다.지금까지 저에게 적용된 기능(필터)은 다음과 같습니다.
$('[name="_invisibleIfEmpty"]').filter(function () {
return $.trim($(this).html()).length == 0;
}).hide();
또는 원하는 대로 .hide(숨기기) 대신 .remove()를 선택합니다.
참고: 특히 이것은 SharePoint에서 성가신 빈 테이블 셀을 숨기기 위해 사용하는 솔루션입니다(이 조건과 더불어 "|$(이것).children("), length("길이").
if (typeof($('#container .prateleira')[0]) === 'undefined') {
$('#ctl00_Conteudo_ctrPaginaSistemaAreaWrapper').css('display','none');
}
if($('#leftmenu').val() == "") {
// statement
}
언급URL : https://stackoverflow.com/questions/4665466/using-an-if-statement-to-check-if-a-div-is-empty
'programing' 카테고리의 다른 글
부모 내부의 마지막 자식이 아닌 특정 클래스가 있는 마지막 요소를 선택하려면 어떻게 해야 합니까? (0) | 2023.08.14 |
---|---|
HttpContext입니다.현재의.부탁한다.Url. 반환되는 호스트? (0) | 2023.08.14 |
Visual Studio 온라인의 원격 분기가 Visual Studio 2015 Team Explorer에 나타나지 않음 (0) | 2023.08.14 |
텍스트 입력 필드에 대한 CSS 선택기? (0) | 2023.08.14 |
Angular를 사용하여 브라우저를 탐지하는 방법은 무엇입니까? (0) | 2023.08.14 |