jQuery — Что я делаю не так. инструкции if — else. wrap (), если элемент является родительским

#jquery #if-statement

#jquery #if-statement

Вопрос:

Основная идея моих инструкций if else заключается в следующем:

  • If .wrap является родительским элементом: сделайте что-нибудь
  • Else: сделайте что-нибудь еще

Это может не иметь особого смысла, но если вы посмотрите на приведенный здесь код:http://jsfiddle.net/C6NQM / .. это может

 if( $('.wrap:parent'); ) 
    { $('.wrap').children().wrap('<div class="new" />'); }
else { $('.wrap').wrap('<div class="new" />'); }
  

Все работает отдельно, если я удаляю if и else, поэтому я пришел к выводу, что с моим условием if что-то не так.

Есть идеи о том, что здесь не так?

Ответ №1:

Я думаю, вы хотите:

 $('.wrap').each(function() {
    if($(this).children().length > 0) {
        $(this).children().wrap('<div class="new" />'); 
    }
    else { 
        $(this).wrap('<div class="new" />'); 
    }
});
  

Обновлена скрипка.

Комментарии к вашему коду:

if( $('.wrap:parent')) всегда будет вычисляться как true . Вызов jQuery всегда возвращает объект jQuery. Вы могли бы сделать if( $('.wrap:parent').length > 0) , но даже тогда вы бы выбрали все элементы в вашем примере, поскольку :parent выбираются также узлы, которые имеют текстовые узлы в качестве дочерних элементов.

Но даже при этом весь оператор будет работать следующим образом: если есть какие-либо .wrap элементы, которые являются родительскими, оберните их дочерние элементы в новый элемент. Если нет, оберните сами элементы.
Таким образом, он не будет обрабатывать каждый .wrap элемент по отдельности.

Обновление: Чтобы охватить все случаи (дочерние элементы, текстовое содержимое, пустое), вам, вероятно, придется сделать:

 $('.wrap').each(function() {
    if($(this).children().length > 0) {
        $(this).children().wrap('<div class="new" />'); 
    }
    else if($(this).text().length > 0) { 
        $(this).html('<div class="new">'   $(this).text()   '</div>'); 
    }
    else {
       $(this).wrap('<div class="new" />'); 
    }
});
  

Комментарии:

1. Почему бы просто не if($(this).children().length) ?

2. @Matt: Более выразительно и проще для понимания новичкам.

3. Ваш код действительно работает, но он кажется ужасно сложным по сравнению с тем, что я собираюсь сделать здесь. И api.jquery.com/parent-selector

4. @Lollero: Ну, не на 100% ясно, что вы хотите сделать. Если вы хотите обрабатывать каждый .wrap элемент по-разному в зависимости от того, есть у него дочерние элементы или нет, вы должны использовать each .

5. @Lollero .each() Это необходимо, потому что вы хотите проверить для каждого элемента .wrap отдельно, являются ли они родительскими или нет. Другим недостатком вашего кода является то, что :parent также будут выбраны те элементы, которые имеют только текстовые узлы в качестве дочерних, поэтому, чтобы сделать это правильно, вам нужно проверить .children().length .

Ответ №2:

Я попытался, и ваш код будет работать, если вы удалите ‘;’ из условия if.

Обновить:

PS: Если вы используете jfiddle.net общая ошибка в javascript также будет выведена в консоли ошибок FireFox и Safari.