jQuery--属性和CSS
1.属性和CSS介绍
属性(重点掌握)
attr(name) 获取指定属性名的值
attr(key,val) 给一个指定属性名设置值
attr(prop) 给多个属性名设置值。参数：prop json数据
removeAttr(name) 移除指定的属性
addClass("aa") 追加一个Class <a class='bb aa'>
removeClass("") 将指定类移除
toggleClass("my") 如果有my将移除，如果没有将添加
val() 获得value的值
val(text) 设置value的值
html() 获得html代码，含有标签
html(...) 设置的是html代码，如果有标签将被解析
text() 只获得文本，不含标签
text(...) 设置文本值，如果文本含有标签，将被转义
CSS(了解即可)
css(name) 获得指定名称的css值
css(name,value) 设置一对值
css(prop) 设置一组值 prop指的是json数据
offset(...) 设置坐标，返回json对象{"top":200,"left":100}
position()
scrollTop() 垂直滚动条 滚过的距离
scrollLeft() 水平滚动条
height([...]) 获得或者设置高度（注意单词为height！！！！）
width([...]) 获得或者设置宽度
2.代码实例
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
5 <title>Insert title here</title>
6 <script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
7 <script type="text/javascript">
8 jQuery(document).ready(function(){
9 //将name=‘username’的input设置为不可用
10 $("input[name='username']").attr("disabled","disabled");
11 //将name=‘username’的input设置为可用 这个必须得移除
12 $("input[name='username']").removeAttr("disabled");
13 //其它的就不一一试了
14 });
15 </script>
16 <style type="text/css">
17 .textClass {
18 background-color: #ff0000;
19 }
20 </style>
21 </head>
22 <body>
23 <h3>表单</h3>
24 <form action="">
25 <table border="1">
26 <tr id="tr1">
27 <td><label>姓名</label></td>
28 <td><input type="text" name="username" class="textClass" value="jack" /></td>
29 </tr>
30 <tr>
31 <td><span>密码</span></td>
32 <td><input type="password" name="password" /></td>
33 </tr>
34 <tr>
35 <td>性别</td>
36 <td>
37 <input type="radio" name="gender" value="男" />男
38 <input type="radio" name="gender" value="女" />女
39 </td>
40 </tr>
41 <tr>
42 <td>爱好</td>
43 <td>
44 <input type="checkbox" name="hobby" value="1"/>抽烟
45 <input type="checkbox" name="hobby" value="2"/>喝酒
46 <input type="checkbox" name="hobby" value="3"/>烫头
47 </td>
48 </tr>
49 <tr>
50 <td>我的照片</td>
51 <td><input type="file" name="image" /></td>
52 </tr>
53 <tr>
54 <td>学历</td>
55 <td>
56 <select name="edu">
57 <option value="1">小班</option>
58 <option value="2">中班</option>
59 <option value="3">大班</option>
60 <option value="4">学前班</option>
61 </select>
62 </td>
63 </tr>
64 <tr>
65 <td></td>
66 <td>
67 <button>普通按钮</button>
68 <input type="submit" value="提交按钮" />
69 <input type="reset" value="重置按钮" />
70 <input type="image" value="图片按钮" src="../image/0050.jpg" style="height: 30px;width: 50px" />
71 </td>
72 </tr>
73 </table>
74 </form>
75
76
77 <h3>公告信息</h3>
78 <div>
79 未满18慎进
80 </div>
81
82 </body>
83 </html>
jQuery--属性和CSS的更多相关文章
- jquery 属性与css操作
属性1.属性 1.1 attr(name|properties|key,value|key,fn) 1) 获取属性值 $("img").attr(&quo ...
- jQuery属性/CSS使用例子
jQuery属性/CSS 1..attr() 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性. 例1:获取元素的属性的值 <p title="段落 ...
- jQuery修改class属性和CSS样式
jQuery修改class属性和CSS样式 class属性修改 类属性即class属性,规定类名. 用类选择器规定样式的时候,需要为元素指定类名,即class属性的值. 注意每个HTML元素只有一个c ...
- jQuery修改操作css属性实现方法
在jquery中我们要动态的修改css属性我们只要使用css()方法就可以实现了,下面我来给各位同学详细介绍介绍. css()方法在使用上具有多样性,我们先来了解css()方法基本知识. css() ...
- jQuery 属性操作和CSS 操作
如有在jQuery方法中涉及到函数,此函数必定会返回一个数值(函数由于运行次数不同触发一些不同效果) jQuery 属性操作方法(以下方法前些日子学习过,不再赘述) addClass() attr() ...
- jquery中的属性和css
jQuery中的属性用于获取或设置元素的属性 1.attr(),获取或设置所有相匹配的元素的属性值:removeAttr("attr"),移除所有相匹配的元素的属性 //html ...
- JQuery DOM操作 、属性和CSS样式操作、其他函数
DOM操作 1.在div1内部最后追加一个节点 $("#div1").append("<img src='../01-HTML基本标签/img/Male.gif'/ ...
- 第一百六十六节，jQuery，基础 DOM 和 CSS 操作，元素内容，元素属性，css和class，元素宽度高度、偏移、滚动条
jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...
- jQuery的简单用法（jQuery的简介，选择器，属性和css,文档处理）
一.jQuery简介 1.1. JS库 JavaScript 库封装了很多预定义的对象和实用函数.能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器. 1.2. 当前流行的 JavaSc ...
- 使用 jQuery 选择器获取页面元素，然后利用 jQuery 对象的 css() 方法设置其 display 样式属性，从而实现显示和隐藏效果。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...
随机推荐
- RFC2544吞吐量测试详细步骤-信而泰Renix软件操作演示
关键词:RFC1242:RFC2544:吞吐量:吞吐率. 吞吐量概述:吞吐量即吞吐率,这个词首先在RFC1242中被提出,是评估网络设备性能的首要指标,其定义是在设备没有丢帧的情况下的最大的转发速率, ...
- updatexml , extractvalue 报错注入
过滤了union, < ,> = 空格过滤,()没有被过滤 updatexml没有被过滤 那么就不能用布尔类型注入 数据库名 username=admin'or(updatexml(1,c ...
- python+pytest(3)-接口测试一般流程及方法
首先我们要明确,通常所接口测试其实就属于功能测试,主要校验接口是否实现预定的功能,虽然有些情况下可能还需要对接口进行性能测试.安全性测试. 在学习接口自动化测试之前,我们先来了解手工接口测试怎样进行. ...
- Objective-C 基础教程第五章,复合
目录 Objective-C 基础教程第五章,复合 什么是复合? Car程序 自定义NSLog() 存取方法get Set Tires(轮胎) 存取方法 Car类代码的其他变化 扩展Car程序 复合还 ...
- 02_opencv_python_图像处理进阶
1 灰度图 import cv2 # opencv读取的格式是BGR import numpy as np import matplotlib.pyplot as plt # Matplotlib是 ...
- Windows原理深入学习系列-访问控制列表-关于安全描述符的补充
这是[信安成长计划]的第 20 篇文章 0x00 目录 0x01 安全描述符的结构 0x02 两个结构的不同点 0x03 真正的查询方案 0x04 参考文章 0x01 安全描述符的结构 在上一篇文章中 ...
- 一比一还原axios源码（零）—— 概要
从vue2版本开始,vue-resource就不再被vue所维护和支持,官方也推荐使用axios,所以,从我使用axios至今,差不多有四五年了,这四五年的时间只能算是熟练应用,很多内部的实现和原理不 ...
- [翻译] TensorFlow 分布式之论文篇 "Implementation of Control Flow in TensorFlow"
[翻译] TensorFlow 分布式之论文篇 "Implementation of Control Flow in TensorFlow" 目录 [翻译] TensorFlow ...
- System x 服务器制作ServerGuide U盘安装Windows Server 2012 R2操作系统
以下内容来源于:联想官方知识库 http://iknow.lenovo.com.cn/detail/dc_154773.html 本例介绍以U盘方式,通过ServerGuide引导在System x ...
- 对于处理datetime数据类型的一些常用方法：
datetime数据类型常用方法: 在项目中从数据库中取出数据后通常需要先绘制图像进行数据的观察,此过程中使用到的方法: 1.时间数据类似于 2022-03-23 14:21:45 可以先转换为dat ...