2013-12-05 9 views
1

мне интересно, если есть лучше способ сделать это:Как установить переменную в зависимости от того, какой nodeList не пуст в JavaScript?

Я пытаюсь установить target либо "[data-update]" или div.ui-content можно найти в элементе.

Изначально я хотел сделать что-то вроде этого:

target = el.querySelectorAll("[data-update]") || el.querySelectorAll("div.ui-content"); 

Но это не будет работать, потому что первое выражение всегда будет определено, даже если это пустая Nodelist [].

Так что теперь у меня есть это, который работает, но я не счастлива с ним:

target = container.querySelectorAll("[data-update]") 

if (target.length === 0) { 
    target = container.querySelectorAll("div.ui-content"); 
} 

if (target.length === 0) { 
    util.errorHandler({"error": "updatePageSection: No target found"}); 
} else { 
    // do stuff 
} 

Вопрос:
Есть ли более простой способ сделать это? Только чистый JavaScript.

Спасибо!

ответ

1

Использование условного оператора и проверьте длину выбора:

target = el.querySelectorAll("[data-update]").length 
    ? el.querySelectorAll("[data-update]") 
    : el.querySelectorAll("div.ui-content"); 

В основном a ? b : c означает , если это правда, взять б, еще взять с. Дополнительная информация: Contional operator.

Кроме того, если вы не хотите повторить первый выбор, вы можете добавить дополнительный шаг:

target = el.querySelectorAll("[data-update]"); 
target = target.length ? target : el.querySelectorAll("div.ui-content"); 

Первый TME вы видите этот синтаксис действительно странно. Но вы скоро привыкнете к этому.

ПРИМЕЧАНИЕ: в JavaScript значение нуля считается ложным. И ничтожное число считается истинным.

+0

спасибо. звучит хорошо – frequent

1

Вы можете сделать это:

target = (el.querySelectorAll("[data-update]").length>0 && 
      el.querySelectorAll("[data-update]")) || 
     (el.querySelectorAll("div.ui-content").length> 0 && 
      el.querySelectorAll("div.ui-content")); 

Но это абсолютно нечитаемым, и слишком много DOM вызывает. Но «однострочный». Fiddle: http://jsfiddle.net/3X2Nd/

 Смежные вопросы

  • Нет связанных вопросов^_^