把函數(shù)匹配字符改寫成“ass”后，為何會是newClass兩個方格變紅？？？
<!DOCTYPE html>
<html>
<head>
? ? <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
? ? <title></title>
? ? <style>
? ? .left,
? ? .right {
? ? ? ? width: 300px;
? ? ? ? height: 120px;
? ? }
? ??
? ? .left div,
? ? .right div {
? ? ? ? width: 100px;
? ? ? ? height: 60px;
? ? ? ? padding: 5px;
? ? ? ? margin: 10px;
? ? ? ? float: left;
? ? ? ? border: 1px solid #ccc;
? ? }
? ? ? ??
? ? .newClass{
? ? ? ? background: #bbffaa;
? ? }
? ? .imoocClass{
? ? ? ? background: red;
? ? }
? ? </style>
? ? <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
? ? <h2>.addClss()方法</h2>
? ? <div class="left">
? ? ? ? <div class="aaron">
? ? ? ? ? ? <p>newClass</p>
? ? ? ? </div>
? ? ? ? <div class="aaron">
? ? ? ? ? ? <p>newClass</p>
? ? ? ? </div>
? ? </div>
? ? <div class="right">
? ? ? ? <div class="aa bb imooc">
? ? ? ? ? ? <article>
? ? ? ? ? ? ? ? <p>imoocClass</p>
? ? ? ? ? ? </article>
? ? ? ? </div>
? ? ? ? <div class="bb cc imooc ">
? ? ? ? ? ? <article>
? ? ? ? ? ? ? ? <p>imoocClass</p>
? ? ? ? ? ? </article>
? ? ? ? </div>
? ? </div>
? ? <script type="text/javascript">?
? ? ? ? //class=left下div元素增加一個新的樣式，增加背景顏色
? ? ? ? $('.left div').addClass('newClass')
? ? </script>
? ? <script type="text/javascript">?
? ??
? ? ? ? //通過className(fucntion)方法
? ? ? ? //這個函數(shù)返回一個或更多用空格隔開的要增加的樣式名。
? ? ? ? //接收index 參數(shù)表示元素在匹配集合中的索引位置和html 參數(shù)表示元素上原來的 HTML 內容
? ? ? ? //找到所有的div，然后通過addClass設置顏色，根據返回的className的判斷，
? ? ? ? $("div").addClass(function(index,className) {
? ? ? ? ? ? //找到類名中包含了imooc的元素
? ? ? ? ? ? if(-1 !== className.indexOf('ass')){
? ? ? ? ? ? ? ? //this指向匹配元素集合中的當前元素
? ? ? ? ? ? ? ? $(this).addClass('imoocClass')
? ? ? ? ? ? }
? ? ? ? });
? ? </script>
</body>
</html>
2017-08-25
添加的是類名 查找的也是類名
原來前兩個方格的類名是aaron
在執(zhí)行上述語句后變?yōu)閍aron?newClass
所以前兩個變紅