Question

我有一个javascript函数隐藏所有div（以及其中的所有元素）。紧接着，调用了一个“show”javascript函数，但我只想显示页面的一个部分，并且孩子们在它下面显示。

例如，我有：

<div id="synchronize" style="display:none;">
  <ul class="bxslider">
    <li>
      <h4>HEADER</h4>
      <p>text</p>
      <p>more text.</p>
    </li>
    <li>hello
    </li>
  </ul>
</div>

当使用bxslider时，一旦调用了javascript，就会在混合中添加几个div。

这是我的javascript：

var theID="synchronize"; //(this value is actually passed in)
div = document.getElementById(theID);
div.style.display = 'block';

$('div#synchronize').children('div').each(function () {
  alert(this.value);
});

警报提供“未定义”。看起来这应该很容易，但我无法弄明白。

提前致谢。

Answer 1

.value将引用表单字段元素，而不是DOM元素。您可能需要this.innerHTML/this.innerText或其亲属，或使用jquery $(this).text()

Answer 2

div个元素没有值。使用alert($(this).attr('innerText'));

编辑：op询问如何获取所有嵌套元素。

这将返回元素的所有子元素。

使用这个html：

<div id="synchronize" style="display:none;">
  <ul class="bxslider">
    <li>
      <h4>HEADER</h4>
      <p>text</p>
      <p>more text.</p>
    </li>
    <li>hello
    </li>
  </ul>
</div>

javascript-- *选择器获取所有子元素，无论嵌套级别如何。

$('#synchronize *').each(function(){
   // do stuff here.
   // create a jquery object from the current element:
   var $element = $(this);

   // set a css value, for example:
   $element.css('display', 'block'); //uses jquery.
   this.style.display = 'block'; //uses pure javascript.
});

显示父项下的所有div /元素

2 个答案: