<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<script type="text/javascript" src="jquery.1.11.1.min.js"></script>

<style type="text/css">

.red{

color: red;

}

.box3{

width: 100px;

height: 100px;

background: red;

}

</style>

</head>

<body>

　

addClass()  添加类名

   removeClass() 移除类名

   toggleClass() 添加或移除类名,这个方法很灵活，很舒服

   html()   无参数时获取内部html或者有参数设置内部html

   text() 无参数时获取内部文本或者有参数设置内部文本

   val()  获取或者设置表单元素的value

   css()  获取或者设置css样式

   一个字符串参数  获取

   一个对象       设置

   两个参数       设置

   attr()         给普通标签设置或者获取属性

   removeAttr()    移除属性

   prop() 给表单元素设置和获取属性

   data() 给JQ对象设置属性

   offset  偏移值

<div id="box">box</div>

   <div id="box1">

      <span>span1</span><span>span2</span>

   </div>

   <div id="box2">111</div>

   <div id="box100"></div>

  

   <input type="text" name="" id="t">

<div class="box3"></div>

<script type="text/javascript">

  //开始这样<div id="box100"></div>，

      //添加属性后变成<div id="box100" name="zhangsan"></div>

      $("#box100").attr("name","zhangsan");  

      $("[name=zhangsan]").html("123")        //因为有属性了，所有可以赋值

      $("#box").addClass("red").click(function(){

         // $(this).removeClass("red");

         //this指id名为box对应的标签,  toggleClass()这个方法有类就删除类，没类就添加类，很灵活，很舒服

         $(this).toggleClass("red");      

      });

 

      $("#box1").html("<span>hello</span>");  //设了参数就替换了原来的值

      $("#box2").text("<span>hello</span>");  //设了参数就替换了原来的值，标签名也会写上去

 

      $("#t").val("happy");            　　 //给表单赋值的

      $("#t").change(function(){           //输入框内容发生改变时,鼠标一移开马上触发

         alert(123)     

      })

      $(".box3").css("background","#FFFF00");　　 //2个值设置宽度

     

      $("#box").attr("index",0);           //添加属性，2个参数添加属性，一个参数获得属性

      $("#box").removeAttr("index");       //移除属性

</script>

</body>

</html>

Jquery属性操作、添加类的更多相关文章

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

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

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

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

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

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

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

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

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

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

  6. Jquery属性操作（入门二）

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

  7. 前端之JQuery：JQuery属性操作

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

  8. jQuery属性操作

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

  9. jQuery属性操作总结

    jquery属性包括以下几个: attr(name|pro|key,val|fn) removeAttr(name) prop(n|p|k,v|f)1.6+ removeProp(name)1.6+ ...

随机推荐

  1. CF908D 【New Year and Arbitrary Arrangement】

    蒟蒻渣渣禹小心翼翼发布题解.... 这道题,嗯,期望,dp,好,我们有思路了.... however, 主要问题在于字符串无限延伸,so,我们需要考虑记录前缀的关键量来为DP设置终止状态. 我们不妨设 ...

  2. 的aspnet_client文件夹

    在早期,有一些asp.net组件是默认要调用(从客户端调用)服务器根(域名)下这个子目录里边的文件的. 不过如果你使用高版本的asp.net,那么全都从你的网站里调用了,因为asp.net有了更好地直 ...

  3. 5G新时代开启，你会选择哪家运营商？

    牌照正式发放后,5G新时代正式来临.而5G时代显然开了个好头,B站UP主"老师好我叫何同学"发布的<有多快?5G在日常使用中的真实体验>视频,引爆全网.除了仅在B站就获 ...

  4. 第七节：Vuejs路由交互及后台系统路由案例

    一. 简介 1.路由的概念 路由的本质就是一种对应关系,比如说我们在url地址中输入我们要访问的url地址之后,浏览器要去请求这个url地址对应的资源.那么url地址和真实的资源之间就有一种对应的关系 ...

  5. 解决：使用 swiper 自动轮播图片，当拖动过 swiper 内的内容时，导致不继续自动轮播

    版本为1.3 当使用了 swiper 后: var mySwiper = new Swiper('.banner .swiper-container', { autoplay: 3000, loop: ...

  6. 5-3 使用antDesign的form组件

    import { Form, Icon, Input, Button, Checkbox } from 'antd'; class NormalLoginForm extends React.Comp ...

  7. win10系统黑屏无法显示桌面解决

    适用情况:win10系统 黑屏无法显示出桌面但是程序能正常运行时 解决方法:win+r 调出运行窗口 运行:Explorer.exe

  8. springboot之快速创建项目

    1.选择创建新项目: 2.选择spring initializr,然后next 3.填写项目元数据,然后next 4.选择项目依赖,然后next 5.点击finish,完成项目创建

  9. OBST（最优二叉搜索树）

    简述一下问题:假设有一颗词典二叉树,我们从中查找需要的单词,使用红黑树或平衡树这样的数据结构总是可以在O(lgN)时间内进行查找,但单词的出现频率是不同的,我们给每个单词加上一个搜索概率,然后通过这些 ...

  10. 关于JDK+Tomcat+eclipse+MyEclipse的配置方法

    说一下关于JDK+Tomcat +eclipse+MyEclipse的配置方法: 1.jdk的配置 我用的是jdk1.6版本,与jdk1.5方法相同.执行完安装程序后就要在进行一下配置,步骤如下:右键 ...