jQuery plugin development

测试代码:

<html>
<script src="jquery_1.7.1.js">
</script>
<script>
 jQuery.fn.println = function() {
  var msg = Array.prototype.join.call(arguments, " ");
  this.each(function(){ 
  jQuery(this).append(document.createTextNode(msg)).append("<br/>");
  });
  return this;
 };
 jQuery.debug = function() {
  var elt = jQuery("#debug");
  if( elt.length == 0) {
  elt = jQuery("<div id = 'debug'><h1>Debugging output </h1></div>");
  jQuery(document.body).append(elt);
  }
  elt.println.apply(elt,arguments);
 };
function start() {
 var x = "hello world";
 var y = 23;
 jQuery.debug("x = ", x , " y = ", y);
}
</script>
<body id = "main" οnlοad="start();">
<h1 id = "header">hello</h1>
</body>
</html>
  1. 在$的prototype上增加一个println的方法:


  2. 使用代码创建一个新的text node用于输出debug 内容:

    调用prototype上定义的println方法:

    输出debug 内容:

    最后结果:

要获取更多Jerry的原创文章,请关注公众号"汪子熙":

发布了7201 篇原创文章 · 获赞 654 · 访问量 126万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 深蓝海洋 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览