1 css操作

2 文本操作

3 属性操作

4 位置

5 尺寸


1、css操作

addClass();// 添加指定的CSS类名。
removeClass();// 移除指定的CSS类名。
hasClass();// 判断样式存不存在
toggleClass();// 切换CSS类名,如果有就移除,如果没有就添加。 css("color","red")//DOM操作:tag.style.color="red"
$("p").css("color", "red"); //将所有p标签的字体设置为红色

2、文本操作

//HTML代码:
html()// 取得第一个匹配元素的html内容
html(val)// 设置所有匹配元素的html内容
//文本值:
text()// 取得所有匹配元素的内容
text(val)// 设置所有匹配元素的内容
//值:
val()// 取得第一个匹配元素的当前值
val(val)// 设置所有匹配元素的值
val([val1, val2])// 设置checkbox、select的值

3、属性操作

//用于ID等或自定义属性
attr(attrName)// 返回第一个匹配元素的属性值
attr(attrName, attrValue)// 为所有匹配元素设置一个属性值
attr({k1: v1, k2:v2})// 为所有匹配元素设置多个属性值
removeAttr()// 从每一个匹配的元素中删除一个属性 //用于checkbox和radio
prop() // 获取属性
removeProp() // 移除属性
因兼容性,checkbox和radio尽量使用特定的prop(),不要使用attr("checked", "checked") <input type="checkbox" value="1">
<input type="radio" value="2">
<script>
$(":checkbox[value='1']").prop("checked", true);
$(":radio[value='2']").prop("checked", true);
</script>

4、位置

offset([coordinates]) //offset方法的参照物是可视窗口
position() //参照物是定位的父亲标签
scrollTop([val])// 获取匹配元素相对滚动条顶部的偏移。
scrollLeft([val])// 获取匹配元素相对滚动条左侧的偏移。
.offset()方法允许我们检索一个元素相对于文档(document)的当前位置。
和 .position()的差别在于: .position()是相对于相对于父级元素的位移。

5、尺寸

height([val|fn])// 取得匹配元素当前计算的高度值(px)
width([val|fn])// 取得第一个匹配元素当前计算的宽度值(px)
innerHeight()//获取第一个匹配元素内部区域高度(包括补白、不包括边框)。
innerWidth()//获取第一个匹配元素内部区域宽度(包括补白、不包括边框)
outerHeight([options])// 获取第一个匹配元素外部高度(默认包括补白和边框)
outerWidth([options])// 获取第一个匹配元素外部宽度(默认包括补白和边框)

jQuery 属性操作的更多相关文章

  1. jquery——属性操作、特殊效果

    1. attr().prop() 取出或者设置某个属性的值 <!DOCTYPE html> <html lang="en"> <head> &l ...

  2. jQuery属性操作

    jQuery 的属性操作的核心部分其实就是对底层 getAttribute().setAttributes()等方法的一系列兼容性处理 ...if ( notxml ) { name = name.t ...

  3. jQuery源代码学习之八——jQuery属性操作模块

    一.jQuery属性模块整体介绍 jQuery的属性操作模块分四个部分:html属性操作,dom属性操作,类样式操作,和值操作. html属性操作(setAttribute/getAttribute) ...

  4. jQuery 属性操作和CSS 操作

    如有在jQuery方法中涉及到函数,此函数必定会返回一个数值(函数由于运行次数不同触发一些不同效果) jQuery 属性操作方法(以下方法前些日子学习过,不再赘述) addClass() attr() ...

  5. python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax

    一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...

  6. jQuery属性操作(四)

    通过阅读jQuery为属性操作封装的基本方法和为处理兼容性问题提供的hooks,发现jQuery在属性操作方面并没有做过多的设计,只是处理一下兼容性问题,然后调用基础的DOM操作方法.以下是对JQue ...

  7. jQuery属性操作(二)

    挂载到$上的几个属性操作方法分析,发现属性操作用到了sizzle封装的方法 attr: function( elem, name, value ) {        var hooks, ret,   ...

  8. jQuery属性操作(一)

    下载了jQuery的UI组件,发现内容还挺多的,还是决定先把jQuery的源码看完一遍之后再涉足UI组件.考虑到队列和动画使用较少,特别是动画,基本开始使用css3完成.因此暂时略过,开始看jQuer ...

  9. web前端----jQuery属性操作

    知识点总结 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个参数是设置属性值 - 点击加载图片示例 remo ...

  10. Jquery属性操作(入门二)

    ********JQuery属性相关的操作******** 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个 ...

随机推荐

  1. sublime text3 修改左边栏背景颜色为编辑栏颜色

    用Package Control安装Theme-Afterglow插件: Ctrl+Shift+P -> install ,如图 点击Install Package,在弹出框中输入Theme-A ...

  2. java序列化,二进制和数据流

    类的序列化需要支持Serializable接口,如果类支持序列化,可以通过ObjectOutPutStream和ObjectInputStream将对象和Stream之间进行方便的转换. 首先来 看一 ...

  3. 通过 mklink 命令创建目录链接实现文件转移

    C:\WINDOWS\system32>mklink /D "C:\ProgramData\Package Cache" "D:\ProgramData\Packa ...

  4. python-class(4)

    #!/usr/bin/env python #-*- coding:utf-8 -*- ############################ #File Name: class4.py #Auth ...

  5. composer 初始化办法和方法

    php -r "readfile('https://getcomposer.org/installer');" > composer-setup.php php -r &qu ...

  6. java - day12 - InteraceTest

    接口的实现.继承等 package test.interfacedemo; import test.interfacedemo.Inter; public class InterfaceDemo { ...

  7. FreeBSD编译安装emacs,不要用ports

    1. 解压emacs 2. 进入解压之后的目录,执行configure命令,大体配置如下: ./configure --with-x-toolkit=no --with-xpm=no --with-j ...

  8. DeepLearnToolbox-master代码学习笔记

    卷积神经网络(CNN)博大精深,网上资料浩如烟海,让初学者无从下手.笔者以为,学习编程还是从代码实例入们最好.目前,学习CNN最好的代码实例就是,DeepLearnToolbox-master,不用装 ...

  9. Spring4 MVC表单验证

    在这篇文章中,我们将学习如何使用Spring表单标签, 表单验证使用 JSR303 的验证注解,hibernate-validators,提供了使用MessageSource和访问静态资源(如CSS, ...

  10. python 爬虫2 Urllib库的高级用法

    1.设置Headers 有些网站不会同意程序直接用上面的方式进行访问,如果识别有问题,那么站点根本不会响应,所以为了完全模拟浏览器的工作,我们需要设置一些Headers 的属性. import url ...