JQuery页眼前端遍历样例 _Web前端

JQuery页面前端遍历样例

?JQuery遍历1:CssClass遍历元素
将所有的checkbox设置为未选中，采用遍历的方法来完成 
控件如下

<button id="ClearPosition" type="button">清空职位</button>

<input type="checkbox"   class="jobPostaJoblist"/><span>导购/促销</span>
<input type="checkbox"   class="jobPostaJoblist"/><span>收银员</span>
 <input type="checkbox"   class="jobPostaJoblist"/><span>店长</span>             


JQUERY代码如下：


jobPostaJoblistSelected是checkbox被选中时的css

stopDefault函数用于中止默认的事件响应

 $("#ClearPosition").each(function(i) {
              $(this).click(function(e) {
                  $("input[class*='jobPostaJoblist']").each(function(i) {
                      $(this).attr("checked", false);
                      $(this).next().removeClass("jobPostaJoblistSelected");
                  });
                  return stopDefault(e);
              });
          });


          function stopDefault(e) {
              if (e && e.preventDefault) {
                  e.preventDefault();
              } else {
                  window.event.returnValue = false;
              }
              return false;
          }

JQuery遍历2：Table内元素
HTML 代码:
<div>DIV</div>
<span>SPAN</span>
<p>P</p>

jQuery 代码:
$("*")

结果:
[ <div>DIV</div>, <span>SPAN</span>, <p>P</p> ]  

同理 你可以取出table的所有
例如:table的id是“table1”
jQuery 代码:
$("#table *")

$("table").find("tr").each(function(){
$(this).find("td").each(function(){
alert($(this).text());
});
});

JQuery遍历3：服务器端控件
$("#trTest td select");asp控件在程序加载前会将服务器控件编译成html控件
DropDownList 就会成为普通的select   
TextBox 是input type=text
但是id不会改
接下来你就应该明白了
$("#trTest td select").each(function () {
  //do something   
 });

JQuery遍历4：DIV内元素
jquery遍历特定ID的div并隐藏，实现代码如下：

$(document).ready(function(){
     var d = $("div");
     $(d).each(function(){
          var dId = $(this).attr("id");
          if(dId.indexOf('advice')>-1){
             $('#'+dId).hide();          
          }
         })
 });