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. iOS学习之设计模式

    iOS开发学习中,经常弄不清楚ios的开发模式,今天我们就来进行简单的总结和探讨~ (一)代理模式 应用场景:当一个类的某些功能需要由别的类来实现,但是又不确定具体会是哪个类实现. 优势:解耦合 敏捷 ...

  2. bootstraps字体图标无法显示

    使用bootstraps字体图标,必须在css的同级文件夹下,建立新的文件夹为fonts,放入一下文件. 在还是无法显示字体图标的情况下,可查看bootstraps.css中的 @font-face ...

  3. Ubuntu系统下Xen虚拟机的基本安装方法（代码创建）

    Ubuntu上Xen安装虚拟机方法一dd一个空的磁盘sudo dd if=/dev/zero of=/home/vm1.img bs=1G count=8 下载Xen VM通用配置文件 sudo wg ...

  4. NSURLSession使用说明及后台工作流程分析

    原文摘自http://www.cocoachina.com/industry/20131106/7304.html NSURLSession是iOS7中新的网络接口,它与咱们熟悉的NSURLConne ...

  5. 球形环境映射之angular与latlong格式互换

    这么做只是纯好奇,因为这种格式互换在实际中是没有意义的,下面映射方式互换的贴图说明了一切. 刚开始打算使用matlab进行贴图映射方式的转换,但许久不用很是生疏,而且生成图片要考虑很多事情,尤其是生成 ...

  6. ThinkPHP_基础（1）目录结构

    (说明:文中的颜色一一对应) 目录结构 www WEB部署目录(或者子目录) ├─index.php 入口文件 ├─README.md README文件 ├─composer.json Compose ...

  7. MVC5 CodeFirst （一）

    创建一个MVC5项目,VS生成了AccountController.HomeController,F5直接运行,实现了注册.登录.修改……但是注册的用户只是在内存里,下面我们来持久化. 三个命令:en ...

  8. react native 之 react-native-image-picke的详细使用图解

    最近需要在react native项目中集成相机和相册的功能,于是在网上找了一个好用的第三方插件:react-native-image-picke. 该插件可以同时给iOS和Android两个平台下使 ...

  9. Android RadioButton 语言无法切换问题

    1.Dialog在不退出界面的情况下,RadioButton在语言切换时,无法匹配系统语言的问题: 解决办法为:在RadioButton添加属性 android:saveEnabled="f ...

  10. selenium获取多窗口句柄并一一切换至原窗口句柄（三个窗口）

    网上有很多是selenium基于python来获取两个窗口句柄与切换,本文实现用python+selenium获取多窗口句柄并一一切换至原窗口句柄(三个窗口),且在每个窗口下进行一个搜索或翻译,然后截 ...