jQuery学习(1)
W3School在线测试工具
一.通过jQuery,选取HTML元素,并对它们执行“操作”。
??? $(this).hide()??????????????? 隐藏当前的HTML元素
????$("#test").hide()????????? 隐藏id="test"的元素 (当id相同时隐藏第一个)
????$("p").hide()??????????????? ?隐藏所有<p>元素
????$(".test").hide????????????? 隐藏所有的元素。
??? $("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。(注:这个没进行测试)
??? $("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
?
三.jQuery CSS 选择器
???? jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。
????下面的例子把所有 <p >元素的背景颜色更改为红色:
$("p").css("background-color","red");
????所有的jquery选择器???
四.Jquery 效果
???? jQuery 可以创建隐藏、显示、切换、滑动以及自定义动画等效果。
??? 显示和隐藏 toggle()=hide()+show()
?$(selector).hide()隐藏被选元素$(selector).show()显示被选元素$(selector).toggle()切换(在隐藏与显示之间)被选元素$(selector).slideDown()向下滑动(显示)被选元素$(selector).slideUp()向上滑动(隐藏)被选元素??? $(selector).slideToggle()对被选元素切换向上滑动和向下滑动$(selector).fadeIn()淡入被选元素$(selector).fadeOut()淡出被选元素$(selector).fadeTo()把被选元素淡出为给定的不透明度$(selector).animate()对被选元素执行自定义动画五.jQuery HTML 操作
?
????????? $(selector).html(content)改变被选元素的(内部)HTML????????? $(selector).append(content)向被选元素的(内部)HTML 追加内容????????? $(selector).prepend(content)向被选元素的(内部)HTML “预置”(Prepend)内容????????? $(selector).after(content)在被选元素之后添加 HTML????????? $(selector).before(content)在被选元素之前添加 HTML?
?