HTML示例代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--HTML区域-->
<h1>第一个标题</h1>
<img src="57eb.jpg">
<div class="nav-2014">
<div class="w">
<div class="w-spacer"></div>
<div class="categorys">
<div class="dt">家用电器分类</div>
<div class="dp">家用电器价格</div>
<img src="rB3.jpg">
</div>
<span class="hr">11</span>
<div class="navitems-2014 chr1 chr2">
<div id="treasure"></div>
<span class="clr clr1"></span>
<span class="chr"></span>
男:<input type="checkbox" value="nan">
女:<input type="checkbox" value="nv">
<input type="text" value="2">
<input type="text" value="3">
</div>
<ul>
<li>第一行</li>
<li>第二行</li>
<li>第三行</li>
<li>第四行</li>
</ul>
</div>
</div>
<h2>第二个标题</h2>
<p>第一段</p>
<p>第二段</p>
</body>
</html>

  

  属性:

  attr(n|k,v|p|f):设置或返回被选属性的值

    name:返回所有所选属性的值

    key,value:以键值对的方式设置所有所选属性的值

    properties:以多个键值对的方式同时设置多个所选属性的值

    key,func:以函数返回的方式设置属性名,属性值

    <script src="jquery-3.1.0.js"></script>
<script>
// name:返回查找的属性的所有值
$("img").attr('src')
// key,value:设置查找的所有属性的值
$("img").attr('src','kong.jpg')
// properties:同时设置多个属性的值
$("img").attr({'src':'test.jpg','alt':'Test_img'})
// 使用函数的方法设置属性的值
$("img").attr("filepath",function(){return this.src})
</script>

  removeAttr(name):删除所选的属性名

    <script src="jquery-3.1.0.js"></script>
<script>
$("img").removeAttr("src")
</script>

  prop(n|k,v|p|f):获取匹配的元素集中的第一个属性值

  name:获取匹配的元素集中第一个属性值

  k,v:以键值对的方式设置所有属性的值

  properties:以多个键值对的方式设置所有属性的值

    <script src="jquery-3.1.0.js"></script>
<script>
// name:选中返回true,未选中返回false
$("input[type=checkbox]").prop("checked")
//        properties 禁用所有
$("input[type=checkbox]").prop({"disabled":true})
//        k,v 取消禁用
$("input[type=checkbox]").prop("disabled",false)
// 选中所有
$("input[type=checkbox]").prop("checked",true)
//     取消所有
$("input[type=checkbox]").prop("checked",fasle)
</script>

  removePrope(name) 删除由prope方法设置的属性集,别的方法设置的属性集它删除不了

    <script src="jquery-3.1.0.js"></script>
<script>
var $para = $("p");
$para.prop("luggageCode",1234);
$para.append("The secret luggage code is: ",String($para.prop("luggageCode")), ". ")
$para.removeProp("luggageCode")
$para.append("now secret luggage code is: ",String($para.prop("luggageCode")), ". ")
</script>

  class类

  addClass(class|fn):为每个匹配的元素添加指定的类名,多个类名以空格隔开

    <script src="jquery-3.1.0.js"></script>
<script>
// addClass:
$("p").addClass("selected select2")
$("ul li:last").addClass(function(){
return 'item-'+$(this).index()
})
</script>

  removeClass(class|fn):从所匹配的元素中删除所有或指定的类

    <script src="jquery-3.1.0.js"></script>
<script>
// 从匹配的元素中删除指定的类
$("span").removeClass("clr")
// 从匹配的元素中删除所有的类
$("span").removeClass()
// 删除最后一个元素上与前一个重复的类
$("li:last").removeClass(function(){
return $(this).prev().attr('class')
})
</script>

  HTML:代码/文本/值

  html(val|fn):取得第一个匹配元素的html内容

    <script src="jquery-3.1.0.js"></script>
<script>
// 取得第一个匹配元素的html内容
$("p").html()
// 设置所有p元素的html内容
$("p").html("hellow <b>world</b>!")
</script>

  text(val|fn):取得所有匹配元素的内容,结果是由所有匹配元素内容组合起来的文本,对html和xml都有效。

    <script src="jquery-3.1.0.js"></script>
<script>
// 取得所有元素的文本内容
$("p").text()
// 设置所有p元素的文本内容
$("p").text("Hellow World..")
</script>

  val(val|fn|arr):获得匹配元素的当前值,当为slelect或多选框时,传入数组数据

    <script src="jquery-3.1.0.js"></script>
<script>
// 取得了第一个input的当前值
$("input").val()
// 设置所有input元素的当前值为hello
$("input").val("hello")
</script>

  

  

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

  1. js进阶 11-2 jquery属性如何操作

    js进阶 11-2  jquery属性如何操作 一.总结 一句话总结:jquery中的属性用attr方法表示.jquery中都是方法. 1.jquery中的属性的增删改查操作? 只需要两个方法, at ...

  2. jQuery DOM/属性/CSS操作

    jQuery DOM 操作 创建元素 只需要把DOM字符串传入$方法即可返回一个 jQuery 对象 var obj = $('<div class="test">&l ...

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

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

  4. jQuery 属性操作和CSS 操作

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

  5. JQuery --- 第二期 (jQuery属性操作)

    个人学习笔记 1.JQuery的内容选择器 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

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

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

  7. jQuery 效果函数,jquery文档操作,jQuery属性操作方法,jQuerycss操作函数,jQuery参考手册-事件,jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  8. JQuery快速入门-操作元素的属性和样式

    我们在学习JavaScript时,详细介绍了DOM对象.从DOM树可以得知,对DOM的操作,主要包括:元素的属性.内容.值.CSS. 一.元素属性的操作 在 jQuery 中,可以对元素的属性执行获取 ...

  9. 前端开发之jQuery属性和文档操作

    主要内容: 1.jQuery属性操作 2.jQuery文档操作 一.jQuery属性操作 1.什么是jQuery的属性操作? jQuery的属性操作模块包括四个部分:html属性操作,dom属性操作, ...

随机推荐

  1. Oracle 数据库--一个用户同步的sql

    用户同步的sql: insert into crm_customer_user ,username,,,,,id, from sys_user where username not in (selec ...

  2. hdu 2066

    ps:我天...之前看了迪杰斯特拉..现在这题要用到floyd..就是先建一个图,然后从列开始遍历,每列里遍历行,行又对应每列... 从A列开始遍历每行,比如遍历到B,这时候B->A知道是2,接 ...

  3. 2016 - 2 - 19 ARC内存管理知识总结(一,arc基本概念及alloc等方法的实现)

    一. ARC的基本概念 1. 在objc中采用automatic reference counting 机制, 让编译器来进行内存管理.在降低程序崩溃,内存管理泄漏等风险的同时,很大程度减少了程序员的 ...

  4. Cookies的作用

    Cookie,有时也用其复数形式Cookies,指某些网站为了辨别用户身份.进行session跟踪而储存在用户本地终端上的数据(通常经过加密).Cookies就是服务器暂存放在你的电脑里的资料(.tx ...

  5. 移动web中一些问题处理与事件说明

    1.1.1 所有盒子以边框开始计算 /*设置宽度以边框开始计算*/-webkit-box-sizing: border-box;box-sizing: border-box; 在移动端通常使用的是百分 ...

  6. OD18

    介绍一个工具exescope   可以修改一些exe程序里的东西 通过这个工具   我们找到了我们要除掉的NAG窗口的具体位置            那我们可以通过OD进行跟踪     来到程序头下段 ...

  7. Xcode6中如何去掉默认的Main.storyboard

    xcode 6取消了 Empty Application 模板来创建一个工程,创建出来的有工程多了Main.storyboard,默认加载Main.storyboard,但是有很多人还想用代码来实现U ...

  8. iredmail安装脚本分析(一)---iRedmail.sh

    iredmail是一套以postfix为核心的整合邮件系统的安装脚本,可以达到快速部署邮件服务器的目的.为了让自己不遗忘shell的语法,所以闲来无事,学习一下他的代码. 我从官网下载他的最新版,解压 ...

  9. 移动端头像上传AJax input file

    jQuery中的Ajax不能支持 input file 需要用ajaxupload.js但是先需要引入jQuery文件 <script src="__PUBLIC__/js/ajaxf ...

  10. python 字符串编码转换

    import chardetdef CheckCode(filename): adchar=chardet.detect(filename) if adchar['encoding']=='utf-8 ...