<div id="baz">
<div id="biz"></div>
<span><span></span></span>
</div>
</div>
<script src="http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
//jQuery code to count child elements $("#foo > div").size()
alert($("#foo > div").size())
</script>
八、更改样式列表
这段代码将帮助你更改样式列表。
$(document).ready(function() {
$("a.cssSwap").click(function() {
//swap the link rel attribute with the value in the rel
$('link[rel=stylesheet]').attr('href' , $(this).attr('rel'));
});
});
九、使用jQuery设定文本大小
加入这段代码,用户可根据需求重新设定文本尺寸(增加或减少)。
$(document).ready(function() {
//find the current font size
var originalFontSize = $('html').css('font-size');//Increase the text size
$(".increaseFont").click(function() {
var currentFontSize = $('html').css('font-size');
var currentFontSizeNumber = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNumber*1.2;
$('html').css('font-size', newFontSize);
return false;
});
//Decrease the Text Size
$(".decreaseFont").click(function() {
var currentFontSize = $('html').css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*0.8;
$('html').css('font-size', newFontSize);
return false;
});
// Reset Font Size
$(".resetFont").click(function(){
$('html').css('font-size', originalFontSize);
});
});
十、检测当前鼠标坐标
使用这个JS代码,你可以在任何浏览器里获取鼠标坐标。
$(document).ready(function() {
$().mousemove(function(e)
{
$('# MouseCoordinates ').html("X Axis Position = " + e.pageX + " and Y Axis Position = " + e.pageY);
});
十一、获取鼠标指针的X / Y轴
$().mousemove(function(e){
//display the x and y axis values inside the P element
$('p').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
});
十二、返回到顶部链接
此代码对于比较长的页面非常实用,用户不必拉滚动条来返回顶部,直接点击“返回顶部”即可。
$(document).ready(function() {
//when the id="top" link is clicked
$('#top').click(function() {
//scoll the page back to the top
$(document).scrollTo(0,500);










