jQuery.ui.widget, jQuery.Extend, jQuery.fn.Extend 的使用方法-原创
步骤：
1：） 编写Js工具类 （这里使用 ideaam.mcs.button.js）
2：） 在HTML中使用
ideaam.mcs.button.js：
(function( $, undefined ) {
//jQuery.ui.widget
$.widget( "ideaam.mcs", {
options: {
run : ""
},
_create:function(){
},
_init:function(){
if (this.options.run == "Say"){
this.changeName();
}
},
changeName:function(){
$(this.element).each(function(i){
$(this).html("Hello World~ :)");
});
}
});
//$.fn.extend
$.fn.extend($.ideaam.mcs, {
add:function(){
alert("test $.fn.extend...");
}
});
//$.extend
$.extend({
add:function(){
alert("test $.extend...");
}
});
})( jQuery );
//jQuery.ui.widget
$.widget( "ideaam.mcs", {
options: {
run : ""
},
_create:function(){
},
_init:function(){
if (this.options.run == "Say"){
this.changeName();
}
},
changeName:function(){
$(this.element).each(function(i){
$(this).html("Hello World~ :)");
});
}
});
//$.fn.extend
$.fn.extend($.ideaam.mcs, {
add:function(){
alert("test $.fn.extend...");
}
});
//$.extend
$.extend({
add:function(){
alert("test $.extend...");
}
});
})( jQuery );
HTML：
<html>
<head><title></title>
<script src="js/jquery-1.7.2.js" type="text/javascript"></script>
<script src="js/jquery.ui.widget.js" type="text/javascript"></script>
<script type="text/javascript" src="js/ideaam.mcs.button.js"></script>
<script type="text/javascript" language ="javascript" >
$(document).ready(function(){
//Test jQuery.ui.widget.
$("#myContent").mcs({run:"Say"});
//Test $.fn.extend
$.ideaam.mcs.add();
//Test $.extend
$.add();
});
</script>
</head>
<body>
<span id ="myContent" />
</body>
</html>
<head><title></title>
<script src="js/jquery-1.7.2.js" type="text/javascript"></script>
<script src="js/jquery.ui.widget.js" type="text/javascript"></script>
<script type="text/javascript" src="js/ideaam.mcs.button.js"></script>
<script type="text/javascript" language ="javascript" >
$(document).ready(function(){
//Test jQuery.ui.widget.
$("#myContent").mcs({run:"Say"});
//Test $.fn.extend
$.ideaam.mcs.add();
//Test $.extend
$.add();
});
</script>
</head>
<body>
<span id ="myContent" />
</body>
</html>
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 10年+ .NET Coder 心语 ── 封装的思维：从隐藏、稳定开始理解其本质意义
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构
· 字符编码：从基础到乱码解决