JavaScript Tutorial/jQuery/jQuery
Версия от 18:52, 25 мая 2010; (обсуждение)
Содержание
Adds two functions into the jQuery namespace.
jQuery.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
});
Adds two plugin methods.
jQuery.fn.extend({
check: function() {
return this.each(function() { this.checked = true; });
},
uncheck: function() {
return this.each(function() { this.checked = false; });
}
});
Create Text node from query list
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var list = $("div,p,span").map(function () {
return this.tagName;
}).get().join(", ");
$("b").append(document.createTextNode(list));
});
</script>
</head>
<body>
<body>
<span>span</span>
<p>p</p>
<div>div</div>
<span>span</span>
</body>
</html>
If jQuery is installed and running
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
if ($) {
$(document).ready(
function() {
$("p").addClass("Loaded");
$("p").text("jQuery loaded and running!");
}
);
}
</script>
<style type="text/css">
p.Loaded {
color: green;
border: 1px solid green;
}
</style>
</head>
<body>
<p>
jQuery is not loaded.
</p>
</body>
</html>
Is jQuery ready
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var $ = "Hi!";
jQuery(function($){
alert("$ = "+ $);
});
});
</script>
</head>
<body>
<body>
<p id="followMe">Follow me!</p>
</body>
</html>
Pass array returned from jQuery to a function
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
function disp(divs) {
var a = [];
for (var i = 0; i < divs.length; i++) {
a.push(divs[i].innerHTML);
}
alert(a.join(" "));
}
disp( $("p").get().reverse() );
});
</script>
</head>
<body>
<body>
<p>A</p><p>B</p>
</body>
</html>
Show the order in the jQuery object.
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var list = $("div,p,span").map(function () {
return this.tagName;
}).get().join(", ");
$("b").append(document.createTextNode(list));
});
</script>
</head>
<body>
<body>
<span>span</span>
<p>p</p>
<div>div</div>
<span>span</span>
</body>
</html>