1. Go to the jQuery official website
Baidu Cloud extract: link: https://pan.baidu.com/s/1W3eKIWtfot_ZYw4fE_t0Tw
extraction code: ksq1
2. How to use:
open compressed in the index.html page
F12 to see the use of the div id
- Right View page source
- ctrl + v search're looking for the name id
- The retrieved content are posted to the self-built html page
- Note that the code to be placed jq $ (function () {}) in
- Also introduced the following documents
<link rel="stylesheet" href="jquery-ui-1.12.1.custom/jquery-ui.css"/>
<script src="jquery-1.12.2.js"></script>
<script src="jquery-ui-1.12.1.custom/jquery-ui.js"></script>
You can also customize CSS style
3. You can also do their own plug-in package
directory structure as
plug-.html
direct method calls .changeBackgrounColor
$ ( "Input [type = button]") only to find<input type="button" />
...
<link rel="stylesheet" href="style.css">
<script src="jquery-1.12.2.js"></script>
<script src="myjquery.js"></script>
<script>
$(function () {
//点击每个按钮改变每个div的背景颜色
$("input[type=button]").click(function () {
$(".cls").changeBackgrounColor($(this).val());
});
});
</script>
</head>
<body>
<input type="button" value="green"/>
<input type="button" value="red"/>
<input type="button" value="blue"/>
<div id="dv">
<div class="cls"></div>
<div class="cls"></div>
...
</div>
</body>
</html>
myjquery.js
$ .fn namespace refers jquery, plus methods and properties on Fn, each active instance will jquery.
$. The Fn meaning (Click for a detailed explanation)
ChangeBackgrounColor objects can belong to one element in any jquery to call
$.fn.changeBackgrounColor=function (color) {
$(".cls").css("backgroundColor",color);
};
