jQuery基础笔记_17-07-17

jQuery 语法

jQuery 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作。

基础语法是：$(selector).action()

• 美元符号定义 jQuery
• 选择符（selector）“查询”和“查找” HTML 元素
• jQuery 的 action() 执行对元素的操作

示例

$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有段落

$(".test").hide() - 隐藏所有 class="test" 的所有元素

$("#test").hide() - 隐藏所有 id="test" 的元素

jQuery 元素选择器

jQuery 使用 CSS 选择器来选取 HTML 元素。

$("p") 选取 <p> 元素。

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取所有 id="demo" 的 <p> 元素。

jQuery 属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

获取图片的路径

运行效果

获取第一段颜色属性

这是一个标题
这是一个段落。
这是另外一个段落。

运行效果

改变字体和背景颜色

这是一个标题
这是一个段落。
这是另外一个段落。

运行效果

获取字段间距和改变字段间距

这是一个标题
这是一个段落。
这是另外一个段落。

运行效果

获取焦点和失去焦点

运行效果

获得焦点失去焦点

快捷回车事件（不完整）

点击一下按钮后按Enter键弹出

获得第一段内容属性

狗鹏
小胖
秦博
黑黑

运行效果

Header 1value 1value 2

运行效果为  value 1