JavaScript Tutorial/jQuery/document
Версия от 21:52, 25 мая 2010; (обсуждение)
Содержание
Document height
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ alert($(document).height());
}); </script> </head> <body> <body>
Hello
Paragraph
</body>
</html></source>
Get document width
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ alert( $(document).width());
}); </script>
<style>
div { width:50px; height:70px; float:left; margin:5px; background:rgb(255,140,0); cursor:pointer; }
</style>
</head> <body> <body>
</body>
</html></source>
Get elements in body tags
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("*", document.body).click(function (e) { e.stopPropagation(); var domEl = $(this).get(0); $("span:first").text("Clicked on - " + domEl.tagName); }); }); </script> </head> <body> <body>
A
B
</body>
</html></source>
Reference document.body
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(document.body).click(function () {$(document.body).append($("
asdf
"));
var n = $("div").length;
$("span").text("There are " + n + " divs." + "Click to add more.");
}).trigger("click");
});
</script>
</head>
<body>
<body>
asdf
asdf
</body>
</html></source>
Sets the background color of the page to black
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <style type="text/css"> .changeP { font-weight: bold; color:red;} </style> <script type="text/javascript"> $(document).ready(function(){ $(document.body).css( "background", "black" );
}); </script> </head> <body> <form> <input type="radio" value="Option"> </form> </body>
</html></source>