web前端----jQuery属性操作
知识点总结
1、属性
属性（如果你的选择器选出了多个对象，那么默认只会返回出第一个属性）、 attr(属性名|属性值)
- 一个参数是获取属性的值，两个参数是设置属性值
- 点击加载图片示例
removeAttr(属性名)
-删除属性的值
prop(属性名|属性值)
- 属性的返回值的是布尔类型
- 单选，反选，取消的例子
removeProp(属性名)
-删除属性的值 循环：each（两种循环示例）
- $.each(数组/对象, function(i, v){})
- $("div").each(function(){})
CSS类
- addClass 添加类属性
- removeClass 移除类属性
- toggleClass 开关|切换（有就移除，没有就添加）
灯泡的例子
HTML代码/文本/值
没有参数就是获取对应的值，
有参数就设置对应的值
- .html() 添加html标签 .html("<span>啦啦啦。</span>")
- .text() 添加文本 .text("啦啦啦。")
- .val()
input :一个参数,获取的是input框里面的值
checkbox :一个参数，获取的是value的值
select :
单选：获取值
多选：得到的是一个数组，设置的时候也要是数组
注意：
在1.x及2.x版本的jQuery中使用attr对checkbox进行复制操作时会出bug，在3.x版本的jQuery中则没有这个问题。为了兼容性，我们在处理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>
示例：全选、反选、取消
一、属性操作
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>属性示例</title>
</head>
<body>
<img src="Bootstrap_i1.png" alt="">
<table border="">
<tbody>
<tr>
<td>1</td>
<td>武侠</td>
<td>销售部</td>
</tr>
<tr>
<td>2</td>
<td>哎哎呀</td>
<td>财经部</td>
</tr>
</tbody>
</table>
<form action="">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="radio">
<select name="" id="">
<option value="">甘肃</option>
<option value="">兰州</option>
<option value="">永登</option>
<option value="">天水</option>
<option value="">庆阳</option>
</select>
</form>
<script src="jquery-3.2.1.min.js"></script>
<script>
// $("img").attr("src","Bootstrap_i3.png");
// $("table").attr("aaa");
// $("table").attr("aaa","按时");
</script>
</body>
</html>
示例
二、示例图片
1、attr
(1)得到属性和设置属性值
(2)设置自定义属性值
2、removeAttr
3、prop
4、removeProp
三、jquery中的循环的两种方式
// 方式一
li = [11,22,33];
$.each(li,function (i,v) {
console.log(i,v)// 0 11
// 1 22
// 2 33
})
// 方式二
$(".c1").each(function (i,v) {
console.log(i,v) //这里的v拿到的是标签
// 0 <div class="c1">hah</div>
// 1 <div class="c1">年</div>
// 2 <div class="c1">娃的</div>
console.log(v.innerText) //拿到文本
})
</script>
退出循环============================
三、注意的一个下问题：
解决方法
web前端----jQuery属性操作的更多相关文章
- Web前端JQuery面试题（二）
Web前端JQuery面试题(二) 1.请写出jquery的语法? <script type="text/javascript"> $(document).ready( ...
- Web前端JQuery面试题（一）
Web前端JQuery面试题(一) 一:选择器 基本选择器 什么是#id,element,.class,*,selector1, selector2, selectorN? 答: 根据给定的id匹配一 ...
- Web前端JQuery面试题（三）
Web前端JQuery面试题(三) 1.怎么阻止冒泡过程? stopPropagation(); // 阻止冒泡过程 2.ready()方法和onload()方法的区别? onload()方法要等页面 ...
- jquery——属性操作、特殊效果
1. attr().prop() 取出或者设置某个属性的值 <!DOCTYPE html> <html lang="en"> <head> &l ...
- 前端之JQuery：JQuery属性操作
Jquery2--属性相关的操作 知识点总结 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个参数是设置属性 ...
- web前端-----jQuery
web前端之jQuery篇 一 jQuery是什么? ［1］ jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. ［2］ j ...
- Python之Web前端jQuery扩展
Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...
- Web前端JQuery入门实战案例
前端jquery入门到实战 为什么要学习Jquery?因为生活. 案例: <!DOCTYPE html> <html lang="zh-CN"> <h ...
- python全栈开发day48-jqurey自定义动画，jQuery属性操作，jQuery的文档操作，jQuery中的ajax
一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...
随机推荐
- Spark2 Dataset多维度统计cube与rollup
val df6 = spark.sql("select gender,children,max(age),avg(age),count(age) from Affairs group by ...
- dataframe转换为多维矩阵，然后可以使用values来实现
import pandas as pd import numpy as np df = pd.DataFrame(np.random.rand(3,3),columns=list('abc'),ind ...
- python的十进制与任意进制的转换
将任意进制转换成十进制 ", 8)) # 表示把8进制的54转换成十进制数并输出结果. # 8可以是2.8,10,16等进制数 将十进制转换成任意进制 def f(n,x): #n为待转换的 ...
- 最简单，最实用的数据库CHM文档生成工具——DBCHM
DBCHM支持SqlServer/MySql/Oracle/PostgreSQL等数据库的表列批注维护管理. DBCHM有以下几个功能 表,列的批注可以编辑保存到数据库. 表,列的批注支持通过pdm文 ...
- <input type=file>上传唯一控件
值得注意的是:当一个表单里面包含这个上传元素的时候,表单的enctype必须指定为multipart/form-data,method必须指定为post,浏览器才会认识并正确执行.但是还有一点,浏览器 ...
- Java中-classpath和路径的使用
javac -classpath的使用: javac:如果当前你要编译的java文件中引用了其它的类(比如说:继承),但该引用类的.class文件不在当前目录下,这种情况下就需要在javac命令后面加 ...
- TOP100summit：【分享实录】爆炸式增长的斗鱼架构平台的演进
本篇文章内容来自2016年TOP100summit斗鱼数据平台部总监吴瑞城的案例分享. 编辑:Cynthia 吴瑞诚:斗鱼数据平台部总监 曾先后就职于淘宝.一号店. 从0到1搭建公司大数据平台.平台规 ...
- vs中如何添加库目录、包含目录以及依赖-----转
在生成时,可能需要首先生成某些项目,以便生成由其他项目使用的可执行代码.使用 “解决方案属性页”对话框 ->“通用属性”->“项目依赖项” 设置当前生成顺序.若要访问此对话框,请在“解决方 ...
- UOJ 145 - 神奇的幻方 - [简单数学题]
题目链接:http://uoj.ac/problem/145 题目描述 幻方是一种很神奇的 N∗N 矩阵:它由数字 1,2,3,⋯⋯,N×N 构成,且每行.每列及两条对角线上的数字之和都相同. 当 N ...
- AjaxAnywhere的用法（FORWARD)
AjaxAnywhere的用法 ajaxanywhere 总结:1,简介AjaxAnywhere被设计成能够把任何一套现存的JSP组件转换成AJAX感知组件而不需要复杂的JavaScript编码. ...