1. 程式人生 > >基本選擇器示例 改變顏色

基本選擇器示例 改變顏色

基本選擇器示例:

改變顏色:

改變id為one的元素的背景色            $('#one')
                                         .css("background","#bbffaa");
										 
<p class="xxxx">22222</p>
<p class="yyyy">22222</p>
<p id="one">scan</p>
<p class="myClass">33333</p>
<p class="zzzz">4444</p>
<script type="text/javascript" src="jquery-2.2.2.min.js"></script>    
<script type="text/javascript" src="a23.js"></script> 

node2:/var/www/html#cat a23.js
var $aa=$("#one");
console.log($aa);

導航至 http://192.168.137.3/a23.html
Object { 0: p#one, length: 1, context: HTMLDocument http://192.168.137.3/a23.html, selector: "#one" }
a23.js:2:1
忽略了對含 [LenientThis] 的屬性進行獲取或設定,因為“this”物件不正確。
a23.html


改變class為mini的所有元素的背景色

$('.mini')
    .css("background","#bbffaa");
	
	
node2:/var/www/html#cat a23.html 
<p class="xxxx">22222</p>
<p class="yyyy">22222</p>
<p id="one">scan</p>
<p class=mini>33333</p>
<p class="zzzz">4444</p>
<script type="text/javascript" src="jquery-2.2.2.min.js"></script>    
<script type="text/javascript" src="a23.js"></script> 


node2:/var/www/html#cat a23.js
$("#one")
  .css("background","#bbffaa");
$('.mini')
  .css("background","#bbffaa");
  
  
改變元素名是<div>的所有元素的背景色 

$('div')
   .css("background","#4384ba");
node2:/var/www/html#cat a23.html 
<p class="xxxx">22222</p>
<p class="yyyy">22222</p>
<p id="one">scan</p>
<p class=mini>33333</p>
<div class=mini>趙楊健</div>
<p class="zzzz">4444</p>
<script type="text/javascript" src="jquery-2.2.2.min.js"></script>    
<script type="text/javascript" src="a23.js"></script> 
node2:/var/www/html#
node2:/var/www/html#cat a23.js
$("#one")
  .css("background","#bbffaa");
$('.mini')
  .css("background","#eeeeeeee");
$('div')
   .css("background","#4384ba");