each方法的使用
隐式迭代—内部帮助我们循环遍历操作 当对每个元素做不同的操作的时候,each方法能够帮助我们遍历jQuery中的对象 each方法中第一个参数为索引值,第二个参数为索引元素
< ! DOCTYPE html>
< html lang= "en" >
< head>
< meta charset= "UTF-8" >
< title> Title< / title>
< style>
* {
margin: 0 ;
padding: 0 ;
}
ul{
list- style- type: none;
}
li{
width: 100 px;
height: 100 px;
background- color: green;
margin- right: 10 px;
float : left;
}
< / style>
< script src= "../jquery-1.12.1.js" > < / script>
< script>
$( function ( ) {
$( "#uu>li" ) . each ( function ( index, ele) {
var opacity= ( index+ 1 ) / 10 ;
$( ele) . css ( "opacity" , opacity) ;
} ) ;
} ) ;
< / script>
< / head>
< body>
< ul id= "uu" >
< li> < / li>
< li> < / li>
< li> < / li>
< li> < / li>
< li> < / li>
< li> < / li>
< li> < / li>
< / ul>
< / body>
< / html>
多库共存技术
当一个页面中引入多个js文件库时,每个js文件库的顶级对象又都是
,
为
了
防
止
,为了防止
, 为 了 防 止 冲突,可以使用noConflict
var w= jQuery. noConflict ( ) ;
var $= 10 ;
console. log ( $) ;
w ( function ( ) {
w ( "#btn" ) . click ( function ( ) {
console. log ( "那是我日夜思念深深爱着的人啊!" ) ;
} ) ;
} ) ;