jQuery 语法实例
$(this).hide()
演示 jQuery 的 hide() 函数,隐藏当前的 HTML 元素。
<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){
<code> $(this).hide()
});
});`
</script>
</head>
<body>
<button type="button">Click me</button>
</body>
</html>
</code>
$("p").hide()
演示 jQuery 的 hide() 函数,隐藏所有 < p> 元素。
$(".test").hide()
演示 jQuery 的 hide() 函数,隐藏所有 class="test" 的元素。
$("#test").hide()
演示 jQuery 的 hide() 函数,隐藏 id="test" 的元素。
Hiding - Sliding- Fading
jQuery fadeOut()
演示简单的 jQuery fadeout() 函数(按时间淡出)。
jQuery hide()
演示简单的 jQuery hide() 函数。
Hide explanations
演示如何隐藏部分文本。
$(document).ready(function(){
$(".ex .hide").click(function(){
/* 在类名为ex的div中,点击其中一个类名为hide的元素,
则隐藏该div视图,另一个同样包含类名为hide元素的
div不受影响,除非也被点击。*/
$(this).parents(".ex").hide("slow");
});
});
Slide panel
演示简单的 Slide Panel 效果。
$(document).ready(function(){
$(".flip").click(function(){ // 点击类名为filp的元素(点击奇数次展开,偶数次收缩)
$(".panel").slideToggle("slow"); // 向下展开显示类名为panel的元素
});
});
jQuery animate()
演示简单的 jQuery animate() 函数。
HTML 操作
改变 HTML 元素的内容。
$("p").html("W3School");
向 HTML 元素追加内容。
在 HTML 元素之后追加内容。
例子解释
CSS 操作
改变 HTML 元素的 CSS 属性。
改变多个 CSS 属性。
获得元素的 CSS 属性。
例子解释
AJAX 和 jQuery
使用 $(selector).load(url) 来改变 HTML 内容。
使用 $.ajax(options) 来改变 HTML 内容。
例子解释
网友评论