JavaScript 创建一个对象实现方法

前端之家收集整理的这篇文章主要介绍了JavaScript 创建一个对象实现方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
定义一个可以选择标签的对象,然后定义了一个each方法和show方法。主要目的是理解jquery是如何工作的。
css:
  1. /**
  2. * @param
  3. * @arrange (512.笔记) jb51.cc
  4. **/
  5. <style type="text/css">
  6. .imgwarp {
  7. text-align: center;
  8. }
  9. .imgwarp img {
  10. margin-left: auto;
  11. margin-right: auto;
  12. }
  13. </style>
html:
  1. <div class="u" id="bdiv">
  2. <a href="http://" id="bt">按钮</a>
  3. <div id="sdiv"class="imgwarp" style="display:none;">
  4. 内容
  5. </div>
  6. </div>
js:
  1. /**
  2. * @param
  3. * @arrange (512.笔记) jb51.cc
  4. **/
  5. <script type="text/javascript">
  6. var lxf = function(selector) {
  7. if (window == this) {
  8. return new lxf(selector);
  9. }
  10. var doms = document.getElementsByTagName(selector);
  11. var arr = [];
  12. for (var i = 0; i < doms.length; i++) {
  13. arr.push(doms.item(i));
  14. }
  15. return this.setArray(arr);
  16. };
  17. lxf.prototype.setArray = function(arr) {
  18. this.length = 0;
  19. [].push.apply(this,arr);
  20. return this;
  21. }
  22. lxf.fn = lxf.prototype;
  23. var $ = lxf;
  24. //each方法
  25. $.fn.each = function(method) {
  26. for (var i = 0,l = this.length; i < l; i++) {
  27. method.call(this[i],i);
  28. }
  29. }
  30. //show方法
  31. $.fn.show = function() {
  32. this.each(function(i) {
  33. alert(i + ":" + this.id + ":" + this.innerHTML);
  34. this.style.display = "block";
  35. });
  36. }
  37. //执行
  38. $('div').show();
  39. </script>

猜你在找的JavaScript相关文章