liguofeng29’s blog

個人勉強用ブログだっす。

jQuery - 拡張

jQuery.fn.extend(object) : jQueryオブジェクトに対して拡張を行う。

jQuery.extend(object) : jQuery名前空間に対して拡張を行う。

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>jQuery </title>
</head>

<body><input name="color" type="checkbox" value="red" /><input name="color" type="checkbox" value="blue" /><input name="color" type="checkbox" value="black" />
    <br />
    <input id="check" type="button" value="check all" />
    <input id="uncheck" type="button" value="uncheck all" />
    <br />
    <script type="text/javascript" src="jquery-1.12.0.min.js">
    </script>
    <script type="text/javascript">
        // jQueryオブジェクトに拡張
        $.fn.extend({
            check: function() {
                return this.each(function() {
                    this.checked = true;
                });
            },
            uncheck: function() {
                return this.each(function() {
                    this.checked = false;
                });
            }
        });
        // jQuery名前空間
        $.extend({
            show: function() {
                alert("jQuery名前空間にFN追加");
            }
        });
        // check
        $("#check").click(function() {
            $(":input").check();
        });
        // uncheck
        $("#uncheck").click(function() {
            $(":input").uncheck();
        });
        // jQuery.text()
        $.test();
    </script>
</body>

</html>