jQuery零碎总结

来源：互联网发布：雕刻机画图软件编辑：程序博客网时间：2024/06/04 20:07
总结一
<html><script>$(function(){  $('p').click(function(){    $(this).hide()  });});</script><body>  <p>点击我就消失了哦~</p></body></html>
$(this).hide() - 隐藏当前元素
$("p").hide() - 隐藏所有 <p> 元素
$("p.test").hide() - 隐藏所有 class="test" 的 <p> 元素
$("#test").hide() - 隐藏所有 id="test" 的元素
总结二
文档就绪事件
这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码，即在 DOM 加载完成后才可以对 DOM 进行操作。
如果在文档没有完全加载之前就运行函数，操作可能失败。
$(function(){//写jQuery代码});
jQuery选择器
id选择器
//选择所有id为test的进行操作$('#test')
class选择器
//选择所有class为test的进行操作$('#test')
$("*")选取所有元素 $(this)选取当前 HTML 元素 $("p.intro")选取 class 为 intro 的 <p> 元素 $("p:first")选取第一个 <p> 元素 $("ul li:first")选取第一个 <ul> 元素的第一个 <li> 元素 $("ul li:first-child")选取每个 <ul> 元素的第一个 <li> 元素 $("[href]")选取带有 href 属性的元素 $("a[target='_blank']")选取所有 target 属性值等于 "_blank" 的 <a> 元素 $("a[target!='_blank']")选取所有 target 属性值不等于 "_blank" 的 <a> 元素 $(":button")选取所有 type="button" 的 <input> 元素 和 <button> 元素 $("tr:even")选取偶数位置的 <tr> 元素 $("tr:odd")选取奇数位置的 <tr> 元素

常见 DOM 事件：
鼠标事件键盘事件表单事件文档/窗口事件clickkeypresssubmitloaddblclickkeydownchangeresizemouseenterkeyupfocusscrollmouseleave blurunload

JQuery获取内容或属性
获得内容 - text()、html() 以及 val()
三个简单实用的用于 DOM 操作的 jQuery 方法：
text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值
获取属性 - attr()
jQuery attr() 方法用于获取属性值。
<html><script>$(document).ready(function(){  $("button").click(function(){    alert($("#runoob").attr("href"));  });});</script></head><body><p><a href="http://www.runoob.com" id="runoob">菜鸟教程</a></p><button>显示 href 属性的值</button></body></html>
添加新的 HTML 内容
我们将学习用于添加新内容的四个 jQuery 方法：
append() - 在被选元素的结尾插入内容
prepend() - 在被选元素的开头插入内容
after() - 在被选元素之后插入内容
before() - 在被选元素之前插入内容
删除元素/内容
如需删除元素和内容，一般可使用以下两个 jQuery 方法：
remove() - 删除被选元素（及其子元素）
empty() - 从被选元素中删除子元素
<script>$(document).ready(function(){  $("button").click(function(){    $("p").remove(".italic");  });});</script><body><p>这是一个段落。</p><p class="italic"><i>这是另外一个段落。</i></p><p class="italic"><i>这是另外一个段落。</i></p><button>移除所有  class="italic" 的 p 元素。</button></body>
HTTP 请求：GET vs. POST
两种在客户端和服务器端进行请求-响应的常用方法是：GET 和 POST。
GET - 从指定的资源请求数据
POST - 向指定的资源提交要处理的数据
GET 基本上用于从服务器获得（取回）数据。注释：GET 方法可能返回缓存数据。
POST 也可用于从服务器获取数据。不过，POST 方法不会缓存数据，并且常用于连同请求一起发送数据。
阅读全文
0 0