使用JavaScript链式编程实现模拟Jquery函数
作者:bea
代码很简单,主要是给大家提供个思路,也算是学习javascript这么长时间的一个小小的练手。 链式编程 是将多个操作(多行代码)通过点号"."链接在一起成为一句代码。链式代码通常要求操作有返回值,但对于很多操作大都是void型,什么也不返回,这样就很难链起来了,当然也有解决办法,可能不太优雅。链式编程的新思想在jQuery中已流行使用 代码如下: <span>Hello,World!</span> <script type="text/
代码很简单,主要是给大家提供个思路,也算是学习javascript这么长时间的一个小小的练手。
链式编程 是将多个操作(多行代码)通过点号"."链接在一起成为一句代码。链式代码通常要求操作有返回值,但对于很多操作大都是void型,什么也不返回,这样就很难链起来了,当然也有解决办法,可能不太优雅。链式编程的新思想在jQuery中已流行使用
代码如下:
<span>Hello,World!</span>
<script type="text/javascript">
Jq = function (tagName) {
var tagArr = document.getElementsByTagName(tagName);
var ret = {
tag: tagArr,
css: function (attribute, value) {
for (var i = 0; i < this.tag.length; i++) {
this.tag[i].style[attribute] = value;
}
return this;
}
}
return ret;
}
window.onload = function () {
Jq("span").css("color", "red")
.css("border", "1px solid green")
.css("padding", "10px");
}
</script>
有意问的话,就留言,大家共同进步
有用 | 无用
链式编程 是将多个操作(多行代码)通过点号"."链接在一起成为一句代码。链式代码通常要求操作有返回值,但对于很多操作大都是void型,什么也不返回,这样就很难链起来了,当然也有解决办法,可能不太优雅。链式编程的新思想在jQuery中已流行使用
代码如下:
<span>Hello,World!</span>
<script type="text/javascript">
Jq = function (tagName) {
var tagArr = document.getElementsByTagName(tagName);
var ret = {
tag: tagArr,
css: function (attribute, value) {
for (var i = 0; i < this.tag.length; i++) {
this.tag[i].style[attribute] = value;
}
return this;
}
}
return ret;
}
window.onload = function () {
Jq("span").css("color", "red")
.css("border", "1px solid green")
.css("padding", "10px");
}
</script>
有意问的话,就留言,大家共同进步
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 使用jQuery和Bootstrap实现多层、自适应模态窗口
- sails框架的学习指南
- NodeJS制作爬虫全过程(续)
- NodeJS制作爬虫全过程
- 了不起的node.js读书笔记之mongodb数据库交互
- javascript动态创建及删除元素的方法
- 了不起的node.js读书笔记之例程分析
- 了不起的node.js读书笔记之node的学习总结
- 了不起的node.js读书笔记之node.js中的特性
- jQuery+ajax中getJSON() 用法实例
- IE8中动态创建script标签onload无效的解决方法
- javascript的日期对象、数组对象、二维数组使用说明
- javascript中的遍历for in 以及with的用法
- Jquery实现图片预加载与延时加载的方法
- javascript定义变量时加var与不加var的区别
- javascript操作字符串的原生方法
- JavaScript动态创建link标签到head里的方法
- javascript中Date对象的getDay方法使用指南
- 原生javaScript实现图片延时加载的方法