由于jquery放在mobile页面上,有时候还是显得有点大,所以今天尝试使用原生来开发,但是习惯了jquery之后,转用原生开发之后,发现原生中,找不到可以替代jquery的css方法,于是对原生的HTMLElement做了一点小扩展,代码如下:

HTMLElement.prototype.css = function(styles) {
for (style in styles) {
this.style.setProperty(style, styles[style]);
}
};

使用方法:

            vcenter.css({
position: 'absolute',
width: w * 100 + '%',
height: h * 100 + '%',
left: '50%',
"margin-Left": '-' + (pvcenter.offsetWidth * 0.9) / 2 + 'px',
top: '50%',
"margin-Top": '-' + (pvcenter.offsetWidth * 0.9) / 2 + 'px'
});
注意:由于css属性中有些属性名称包含了'-',这样的符号,在js中使用这样的符号定义变量名是不合法的,所以在设置这类型的css属性时,需要加上引号。

使用原生实现jquery中的css方法的更多相关文章

  1. JQuery:JQuery 中的CSS()方法

    JQuery:CSS()方法jQuery css()方法:css()方法设置或返回被选元素的一个或多个样式属性.1.返回 CSS 属性如需返回指定的 CSS 属性的值,请使用如下语法:css(&quo ...

  2. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  3. jQuery中的ready方法及实现按需加载css,js

    模拟jQuery中的ready方法及实现按需加载css,js 一.ready函数的实现 经常用jQuery类库或其他类库中的ready方法,有时候想想它们到底是怎么实现的,但是看了一下jQuery中的 ...

  4. 【转发】JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...

  5. 模拟jQuery中的ready方法及实现按需加载css,js实例代码

    这篇文章介绍了模拟jQuery中的ready方法及实现按需加载css,js实例代码,有需要的朋友可以参考一下     一.ready函数的实现经常用jQuery类库或其他类库中的ready方法,有时候 ...

  6. jquery 中一些 特殊方法 的特殊使用 一览表

    cnblogs的页面, 一种是管理页面, 是随笔的列表 a full list of essays. 另一种是 首页. 要搜索文档的话, 就使用 "首页"的那种方式. 一个jque ...

  7. 用JQuery中的Ajax方法获取web service等后台程序中的方法

    用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...

  8. HTML5中的data-*属性和jQuery中的.data()方法使用

    原文地址链接:http://blog.csdn.net/fly_zxy/article/details/50687691: HTML5中的data-*属性 我们往往会根据需要在HTML标记上添加自定义 ...

  9. 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式。

    查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式. 要求如下: 点击页面的"更改样式"按钮后, ...

随机推荐

  1. hadoop 小知识点

    ------------------------------------------- 配置hadoop的最小blocksize,必须是512的倍数. [hdfs-site.xml] dfs.name ...

  2. 【原】Coursera—Andrew Ng机器学习—课程笔记 Lecture 8_Neural Networks Representation 神经网络的表述

    神经网络是一种受大脑工作原理启发的模式. 它在许多应用中广泛使用:当您的手机解释并理解您的语音命令时,很可能是神经网络正在帮助理解您的语音; 当您兑现支票时,自动读取数字的机器也使用神经网络. 8.1 ...

  3. inux php pdo mysql 扩展

    今天在本机部署了一个pdo项目,发现一些问题,真没想到pdo mysql,不容易装啊,哈哈,我说的不容易,是因为php5.3以前版本,yum源里面根本没有.部署后就报,Undefined class ...

  4. selenium2 断言失败自动截图 (四)

    一般web应用程序出错过后,会抛出异常.这个时候能截个图下来,当然是极好的. selenium自带了截图功能. //获取截图file File scrFile= ((TakesScreenshot)d ...

  5. maven安装错误履历

    1\:maven cannot find entry:"/src/main/java" 先删除source下的文件夹 再新建文件夹

  6. c语言实践 数字特征值

    这题的要求是这样的: 这题我没做出来,我大概思路是这样的,根据输入的数字,把这个数字的每一位都分离出来,然后判断奇数还是偶数,再判断序是奇数还是偶数,最后两个奇偶性比较,输出1还是0,这个输出的1和0 ...

  7. js 遮罩层请稍后

    this.WaitMessage = function (msg) { $("<div class=\"datagrid-mask\"></div> ...

  8. Java IO流的回顾与梳理(必记必会必写)

  9. Delphi xe7 up1 调用android振动功能

    Delphi xe7 up1 调用android振动功能 振动用到以下4个单元: Androidapi.JNI.App,Androidapi.JNIBridge,Androidapi.JNI.Os,A ...

  10. Log--检查各数据库日志的使用情况

    -- Recovery model, log reuse wait description, log file size,-- log usage size and compatibility lev ...