使用jQuery的".css()"和".attr()"方法设置元素"left"属性的注意点
今天在使用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"属性的注意点的更多相关文章
- jquery 实践操作:attr()方法
此篇要记录的是 关于 jquery 的 attr() 方法 在JS中设置节点的属性与属性值用到setAttribute(),获得节点的属性与属性值用到getAttribute(),而在jquery中 ...
- jquery操作css样式的方法
jquery操作css样式的方法(设置和获取)
- php 与 jquery中$.post()与attr()方法的简单实例 amaze modal 模态窗口
$(selector).attr(attribute,value)$.post() 在jqery中有这样一个方法,$.post()下面就这个方法做一个简单的实例: jQuery.post( url, ...
- CSS()方法设置元素样式
使用CSS()方法可以直接设置元素的样式,方法为:css(name,value) $(p).css("font-weight", "bold"); // ...
- jQuery使用之(二)设置元素的样式
css是页面不能分隔的部分,jQuery中也提供了一些css相关的实用的办法.前面章节中有使用过 addClass()为元素添加css样式风格.本节主要介绍jQuery如何设置页面的样式风格.包括添加 ...
- jQuery学习笔记(4)-设置元素的属性和样式
一.前言 本篇主要讲解如何使用jQuery获取和操作元素的属性和css样式 二."DOM属性"与元素属性 1.运行一下代码 <img src="/images/lo ...
- 从零开始学 Web 之 jQuery(二)获取和操作元素的属性
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- js | javascript获取和设置元素的属性
获取和设置元素的内容: var nv = document.getElementById("pid"); alert(nv.innerHTML); nv.innerHTML=&qu ...
- 认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。元素、属性和文本的树结构(节点树)。
认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码 ...
随机推荐
- luogu P3835 【模板】可持久化平衡树
#include<iostream> #include<cstdio> #include<cstring> #include<cstdlib> usin ...
- 堆--P1168 中位数
题目描述 给出一个长度为N的非负整数序列Ai,对于所有1≤k≤(N+1)/2,输出A1,A3,…,A2k−1的中位数.即前1,3,5,…个数的中位数. 输入格式 第1行为一个正整数N,表示了序列长度 ...
- c语言中指针和多维数组的理解
1.复习指针和数组之间的特殊关系:不带方括号的数组名是一个指针,指向该数组的第一个元素. 2.多维数组: ][];//声明一个二维数组作为举例 a.理解方式1:可以将数组看成行和列构成,即理解成2行4 ...
- UML-类图-箭头
概览 1.泛化 一般理解为 继承.实线+空心箭头 2.依赖 成员变量.局部变量.参数.虚线+箭头 public class Sale { public void updatePriceFor(Prod ...
- 学会用Python操作Mongodb
在linux下,用pip导包. pip install pymongo python操作基本步骤: 导包 建立连接,建立客户端. 获取数据库 获取集合 对数据操作 import pymongo #建立 ...
- 洛谷 P2278 [HNOI2003]操作系统
题目传送门 解题思路: 一道没啥思维含量的模拟题,但是个人感觉代码实现不简单,可能是我太弱了,花了我6个小时,3次重写. AC代码: #include<iostream> #include ...
- python-day8爬虫基础之数据存储
数据存储,在爬虫中也是十分的重要,因为我们要把我们想要的数据保存到本地,其中最简单直接的就是保存为文件文本,比如:TXT.JSON.CSV等等,除此之外,我们还可以将其保存到数据库中,常见的数据库类型 ...
- matlab设置mex失败
更新 使用matlab2017b时,又报错, >> mex -setup 警告: Xcode is installed, but its license has not been acce ...
- 10)global预定义变量
代码展示: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- 14 微服务电商【黑马乐优商城】:day04-项目搭建(二)
本项目的笔记和资料的Download,请点击这一句话自行获取. day01-springboot(理论篇) :day01-springboot(实践篇) day02-springcloud(理论篇一) ...