CSS / JavaScript: получить видимый пользователю текст элемента

Question

Предположим, у меня есть следующий HTML:

<div id="test">
  <span style="display:inline;">foo</span>
  <span style="display:none;">bar</span>
  <span style="display:inline;">baz</span>
</div>

.. есть ли в JavaScript какой-то способ для меня получить вывод "foo baz" (не "foo bar baz")?

$('test').textContent возвращает последнее, а innerHTML делает эквивалент.

Меня не волнует, является ли используемый метод хакерским или обходным, и я могу справиться с ним, если он зависит от браузера или требует Flash.

Тем не менее, он не должен требовать ничего, кроме JS или Flash, он не должен требовать взаимодействия с пользователем и не должен возвращать 'bar'.

Идеи

Answer 1

Вы можете сделать это, но учтите, что в нем не будет пробела, как в вашем примере, потому что в разметке нет места:

$("#test :visible").text()

Вот альтернатива, например, ваш пример разнесен для каждого диапазона:

var s = new Array();
$("#test :visible").each(function() {
   s.push($(this).text());
});
alert(s.join(' '));