`
ning_wenchao
  • 浏览: 2666 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

封装css框架 一、俩参数代码

阅读更多
//itcast 是自己封装的框架名称

itcast.fn.extend({
css:function(name,value){
//        只有一个参数的情况时肯定是查询
if(value ===undefined && typeof name ==="string"){

//            两种兼容方式,获取样式兼容  如ie 和其他浏览器
if(window.getComputedStyle){
//其他浏览器
var styles = window.getComputedStyle(this[0]);
return styles[name];
            }else {

//ie浏览器
return this[0].currentStyle[name];
            }
        }

//        设置值情况
this.each(function(){
//          传入的参数只有一个时  并且这个参数类型为object 对象那么就可以对这个对象进行遍历
传入的是一个对象
if(value === undefined && typeof name ==="object"){
for(var k in name){
//遍历对象 然后获取到对象的属性值,赋值给this.style[k](例div.style.width);
this.style[k] = name[k];
                }
            }else {
//第二个参数value,设置具体的值
this.style[name] = value;
            }
        })
//返回对象本身  便于连式编程
return this;
    }
})

itcast("div").css("width","3133px");
console.log(s);
分享到:
评论

相关推荐

    MVC框架代码

    学习和理解自封装的MVC框架,可以帮助开发者深入理解分层架构的设计思想,掌握如何组织和管理代码,提高代码质量。此外,它还可以作为基础,为开发者构建自己的轻量级Web应用框架提供实践经验和灵感。 总结,MVC...

    movejs基于CSS3的JavaScript动画框架

    它通过JavaScript封装了CSS3动画,并提供了一个简洁的API,使得开发者能够快速地创建出复杂的动画效果。 Move.js的核心特性主要体现在以下几个方面: 1. **硬件加速**:Move.js充分利用了CSS3的硬件加速特性,确保...

    vue3基础框架封装yyds

    "vue3基础框架封装yyds"这个标题表明我们将讨论如何利用Vue3构建一个基础的后台管理系统,并且可能涉及到对Vue3的一些高级特性或者最佳实践的封装。 描述中的"npm i"命令意味着我们首先需要安装项目依赖,这通常...

    js 手动封装的各种效果

    例如,可以创建一个通用的查找元素的函数,接受CSS选择器作为参数。 8. **数组和字符串方法**:封装一些数组和字符串处理的函数,如查找、过滤、拼接等,可以提高代码的可读性和效率。 9. **模板引擎**:封装一个...

    二次封装WebUpLoader兼容一切浏览器

    通过封装,我们可以避免直接操作复杂的内部逻辑,让代码更加简洁,同时减少可能出现的兼容性问题。 三、二次封装步骤 1. 引入WebUploader库:首先,在HTML文件中引入WebUploader的JavaScript和CSS文件。 2. 创建...

    自定义Ajax框架,struts框架的模拟,特效代码

    框架的核心是创建一个可以封装Ajax请求的函数或类,该函数应具备以下功能: 1. **发起请求**:利用XMLHttpRequest对象或现代浏览器中的fetch API来发送HTTP请求。 2. **处理参数**:接收URL、数据、请求类型(GET/...

    代码热加载webpack打包weex原生调用vue组件封装weex内置组件使用

    Weex是由阿里巴巴开源的一款跨平台的UI框架,它允许开发者使用一套代码来构建iOS、Android以及Web应用。Weex基于Vue.js的语法,因此对于熟悉Vue的开发者来说,学习Weex相对容易。Weex通过转换Vue组件为原生移动应用...

    vue封装 openlayers组件库 地图设置

    在IT领域,尤其是在Web开发中,Vue.js是一个非常流行的前端框架,它允许开发者构建用户界面。结合OpenLayers,我们可以创建强大的交互式地图应用。本文将详细介绍如何基于Vue.js封装一个OpenLayers组件库,并进行...

    封装一个Ext消息提示框,显示几秒后自动消失

    该资源主要涵盖了 CSS 和 JavaScript 代码,旨在实现一个可以自动消失的消息提示框。 1. CSS 代码分析 在 CSS 代码中,我们可以看到一些重要的样式定义。例如,`.msg-box-mc` 类定义了字体大小为 14px 的样式,`....

    Element + Vue 封装的table组件

    在IT行业中,前端框架的发展日新月异,Vue.js作为一款轻量级、高性能的JavaScript框架,被广泛应用在Web开发中。Element UI是基于Vue.js的一套企业级UI组件库,它提供了丰富的组件,帮助开发者快速构建美观的界面。...

    dwz框架及api文档

    DWZ框架是一款基于JavaScript的开源前端开发框架,主要用于构建富互联网应用(Rich Internet Applications,简称RIA)。该框架设计目标是简化网页应用的开发流程,提高用户体验,并且具有良好的可扩展性和易用性。...

    标题栏封装

    标题栏封装是软件开发中一个重要的实践,尤其是在GUI(图形用户界面)应用中。它主要涉及到如何有效地管理和呈现应用程序的标题部分,以提供清晰的视觉指示、操作菜单以及用户交互功能。通过封装,开发者可以创建...

    layui封装项目

    layui,作为一款优秀的前端UI框架,因其简洁、优雅的设计风格和强大的功能,深受广大开发者的喜爱。本项目主要围绕layui的封装进行探讨,旨在帮助开发者更高效地利用layui构建高质量的Web应用。下面我们将详细讲解...

    基于bootstrap框架拓展的web框架

    基于 Bootstrap 框架拓展的 Web 框架则是在其基础上进一步封装和扩展,以提供更丰富的功能、组件以及定制化选项,从而帮助开发者更高效地构建现代化的 Web 应用程序。 标题中的“基于Bootstrap框架拓展的Web框架”...

    JHPHP框架 v1.0.rar

    1. **config**:配置文件夹,存放框架的配置信息,如数据库连接参数等。 2. **controllers**:控制器文件夹,包含了各种业务逻辑处理的控制器类。 3. **models**:模型文件夹,存放数据处理和业务逻辑的类。 4. **...

    二次封装element组件

    在IT行业中,Element UI 是一款非常流行的前端框架,它提供了丰富的UI组件,使得开发者能够快速构建美观、响应式的Web应用。本项目主题是"二次封装element组件",意味着作者已经对Element UI 的某些组件进行了定制化...

    基于amazeui框架头像上传代码.zip

    在“基于amazeui框架头像上传代码”这个压缩包中,我们可以找到一个实现头像上传功能的示例代码。这个功能在很多网站和个人资料设置中都非常常见,用户可以通过点击按钮来选择或拍摄照片,然后将其作为自己的头像。 ...

    原生js封装运动框架的示例讲解

    在这篇关于原生JavaScript封装运动框架的示例讲解中,涵盖了如何通过原生JavaScript实现一个简单的动画运动框架的基本方法。文章提供了核心代码及其详细解释,下面是对文章中知识点的详细总结: ### 1. 基本概念与...

    SSM框架详细整合教程

    - MyBatis避免了几乎所有的JDBC代码和手动设置参数以及获取结果集,使得数据库操作更加方便。 - 它通过XML或注解配置和Java的POJOs映射成数据库中的记录。 - MyBatis提供了SQL Maps和DataAccessObjects(DAO)的...

    基于SSM框架的图书管理系统项目源码

    本项目源码是基于SSM框架实现的一个图书管理系统的实例,旨在帮助开发者理解如何在实际开发中运用这些技术。 首先,Spring框架是整个项目的基石,它提供依赖注入(DI)和面向切面编程(AOP)等功能,使得代码更加...

Global site tag (gtag.js) - Google Analytics