jquery(2)

获得内容 - text()、html() 以及 val()
三个简单实用的用于 DOM 操作的 jQuery 方法：text() - 设置或返回所选元素的文本内容 ----不能识别标签
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值----- 即登陆框输入的内容

 

常用选择器

https://www.cnblogs.com/liwenzhou/p/8178806.html
$("#id")
$("tagName")
$(".className")
$("#id, .className, tagName")
$("x y");// x的所有后代y（子子孙孙）
$("x > y");// x的所有儿子y（儿子）

　　

常见筛选器

:first // 第一个
:last // 最后一个
:eq(index)// 索引等于index的那个元素
:not(元素选择器)// 移除所有满足not条件的标签
:has(元素选择器)// 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)
例子
$("div:has(h1)")// 找到所有后代中有h1标签的div标签
$("div:has(.c1)")// 找到所有后代中有c1样式类的div标签
$("li:not(.c1)")// 找到所有不包含c1样式类的li标签
$("li:not(:has(a))")// 找到所有后代中不含a标签的li标签

　　

属性选择器

属性选择器
[attribute]
[attribute=value]// 属性等于
[attribute!=value]// 属性不等于
// 示例
<input type="text">
<input type="password">
<input type="checkbox">
$("input[type='checkbox']");// 取到checkbox类型的input标签
$("input[type!='text']");// 取到类型不是text的input标签

　　

表单筛选器

表单常用筛选：
:text
:password
:file
:radio
:checkbox:submit
:reset
:button
例子
$(":checkbox")  // 找到所有的checkbox
表单对象属性:
:enabled
:disabled
:checked
:selected例子一
<form><input name="email" disabled="disabled" /><input name="id" />
</form>$("input:enabled")  // 找到可用的input标签
例子二
<select id="s1"><option value="beijing">北京市</option><option value="shanghai">上海市</option><option selected value="guangzhou">广州市</option><option value="shenzhen">深圳市</option>
</select>$(":selected")  // 找到所有被选中的option

　　

常用筛选器

$("#id").next()          ------匹配之后紧挨的同辈元素
$("#id").nextAll()       ------匹配之后所有的同辈元素　
$("#id").children();// 所有儿子们
$("#id").siblings();// 所有兄弟们

$("#id").parent()
$("#id").parents()  // 查找当前元素的所有的父辈元素

　　

常用样式操作

addClass();// 添加指定的CSS类名。
removeClass();// 移除指定的CSS类名。

scrollTop()// 获取匹配元素相对滚动条顶部的偏移
scrollLeft()// 获取匹配元素相对滚动条左侧的偏移

hasClass();// 判断样式存不存在

toggleClass();// 切换CSS类名，如果有就移除，如果没有就添加。

　　

 

文本操作

HTML代码：html()// 取得第一个匹配元素的html内容
html(val)// 设置所有匹配元素的html内容
文本值：text()// 取得所有匹配元素的内容
text(val)// 设置所有匹配元素的内容
值：val()// 取得第一个匹配元素的当前值
val(val)// 设置所有匹配元素的值
val([val1, val2])// 设置checkbox、select的值
示例：获取被选中的checkbox或radio的值：<label for="c1">女</label>
<input name="gender" id="c1" type="radio" value="0">
<label for="c2">男</label>
<input name="gender" id="c2" type="radio" value="1">

可以使用

$("input[name='gender']:checked").val()

　克隆

clone()// 参数

　　

 

文档处理

添加到指定元素内部的后面$(A).append(B)// 把B追加到A添加到指定元素内部的前面$(A).prepend(B)// 把B前置到A添加到指定元素外部的后面$(A).after(B)// 把B放到A的后面
添加到指定元素外部的前面$(A).before(B)// 把B放到A的前面
$(A).insertBefore(B)// 把A放到B的前面
移除和清空元素remove()// 从DOM中删除所有匹配的元素。empty()// 删除匹配的元素集合中所有的子节点。（不常用）