jq简单遍历对象

来源:互联网 发布:js mvvm框架 编辑:程序博客网 时间:2024/06/07 18:56

<html><head>    <script src="Scripts/jquery-1.10.2.js"></script><script type="text/javascript">$(document).ready(function(){   $("#show").click(function(){        //遍历对象并改变对象内容字体颜色      $("li").each(function (indext, element) {          //弹窗对象内容          alert(($(this).index() + 1) + ":" + $(element).get(0).innerText);          //设置对象内容字体颜色          $(this).css("color","blue");      });  });});</script></head><body><h2>This is a heading</h2><p>This is a paragraph.</p><p>This is another paragraph.</p><h3>图书种类</h3><ul type="circle"><li >计算机类</li><li>教材类</li><li>杂志类</li><li id = "my_love">文学类</li></ul><h3>运动</h3><ol ><li>篮球</li><li>足球</li><li>羽毛球</li><li class = "my_love" title="sport">乒乓球</li></ol><ul><li id="foo">foo</li><li id="bar">bar</li></ul><button id="hide" type="button">隐藏</button><button id="show" type="button">显示</button></body></html> 

This is a heading

This is a paragraph.

This is another paragraph.

图书种类

  • 计算机类
  • 教材类
  • 杂志类
  • 文学类

运动

  1. 篮球
  2. 足球
  3. 羽毛球
  4. 乒乓球
  • foo
  • bar
0 0
原创粉丝点击