今天在使用jQuery方法".css()"设置"ajax-loader.gif"的位置时出了点小状况,关键代码如下(为了简化,这里假定要给"ajax-loader.gif"设置的左边距离固定为"300px"):

    $('#svgLoading').css("left", "300px");

这时,"ajax-loader.gif"图片的位置并没有生效! WHY?

很容易地想到另外一种实现方式:

    $('#svgLoading').attr("style", "left:300px;");

binggo, 正确!

WHY?难道".css()"和".attr()"在设置"style"中的属性时不能等价?自然地,百度, 加google...结果都类似地解释——"css设置style里的样式,attr设置属性"...

最终发现了问题所在:

  tip1. 使用".css()"设置style里的样式时,如果是"长度"值,则默认的单位为"px",所以不需要,也不能显式地指明单位,否则,设置的样式就会不起作用!

  tip2. 使用".attr()"设置style里的样式时,如果是"长度"值,则需要,也必须要指明单位,否则,也同样失效!

小结:

error:

$('#svgLoading').css("left", "300px");

$('#svgLoading').attr("style", "left:300;");

right:

$('#svgLoading').css("left", );

$('#svgLoading').attr("style", "left:300px;");

使用jQuery的".css()"和".attr()"方法设置元素"left"属性的注意点的更多相关文章

  1. jquery 实践操作:attr()方法

    此篇要记录的是 关于 jquery  的 attr() 方法 在JS中设置节点的属性与属性值用到setAttribute(),获得节点的属性与属性值用到getAttribute(),而在jquery中 ...

  2. jquery操作css样式的方法

    jquery操作css样式的方法(设置和获取)

  3. php 与 jquery中$.post()与attr()方法的简单实例 amaze modal 模态窗口

    $(selector).attr(attribute,value)$.post() 在jqery中有这样一个方法,$.post()下面就这个方法做一个简单的实例: jQuery.post( url, ...

  4. CSS()方法设置元素样式

    使用CSS()方法可以直接设置元素的样式,方法为:css(name,value) $(p).css("font-weight", "bold");     // ...

  5. jQuery使用之(二)设置元素的样式

    css是页面不能分隔的部分,jQuery中也提供了一些css相关的实用的办法.前面章节中有使用过 addClass()为元素添加css样式风格.本节主要介绍jQuery如何设置页面的样式风格.包括添加 ...

  6. jQuery学习笔记(4)-设置元素的属性和样式

    一.前言 本篇主要讲解如何使用jQuery获取和操作元素的属性和css样式 二."DOM属性"与元素属性 1.运行一下代码 <img src="/images/lo ...

  7. 从零开始学 Web 之 jQuery(二)获取和操作元素的属性

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  8. js | javascript获取和设置元素的属性

    获取和设置元素的内容: var nv = document.getElementById("pid"); alert(nv.innerHTML); nv.innerHTML=&qu ...

  9. 认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。元素、属性和文本的树结构(节点树)。

    认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码 ...

随机推荐

  1. php开启opcache

    OPcache 通过将 PHP 脚本预编译的字节码存储到共享内存中来提升 PHP 的性能, 存储预编译字节码的好处就是 省去了每次加载和解析 PHP 脚本的开销. 一.php.ini配置opchche ...

  2. 富文本编辑器Tinymce的示例和配置

    Demo链接: https://download.csdn.net/download/silverbutter/10557703 有时候需要验证tinyMCE编辑器中的内容是否符合规范(不为空),就需 ...

  3. Linux-编写简单守护进程

    1.任何一个进程都可以将自己实现成一个守护进程 2.create_daemon函数要素 (1).子进程要等待父进程退出 (2).子进程使用setsid创建新的会话期,脱离控制台 (3).调用chdir ...

  4. 2019CSP-J游记

    2019-10-19:开一个坑,今天初赛,我是我们考场唯一几个坚持到16:45收卷的人,我们是机试,竟然可以用编译器. 这次初赛总体感觉打得不错,卷面满分200,最后实际分数,就是卷面分除以二. 初赛 ...

  5. 吴裕雄--天生自然 pythonTensorFlow图形数据处理:多线程队列操作

    import tensorflow as tf #1. 定义队列及其操作. queue = tf.FIFOQueue(100,"float") enqueue_op = queue ...

  6. debian8.8安装sougou输入法

    传送门:http://www.cnblogs.com/ligongzi/p/6137601.html 亲测可用

  7. java select单线程 服务器

    package com.Select; /** *select单线程 服务器 **/ import java.io.IOException; import java.net.InetSocketAdd ...

  8. opencv模板匹配查找图像(python)

    #!/usr/bin/env python3 # -*- coding: utf-8 -*- import cv2 import numpy as np from cv2 import COLOR_B ...

  9. Linux下查找Nginx配置文件位置

    1.查看Nginx进程 命令: ps -aux | grep nginx 圈出的就是Nginx的二进制文件 2.测试Nginx配置文件 /usr/sbin/nginx -t 可以看到nginx配置文件 ...

  10. day10-time模块

    import time print(time.time()) #时间戳1553070877.0166008 print(time.strftime('%Y-%m-%d %H %M %S')) #201 ...