Hướng dẫn jquery css display - hiển thị jquery css

• Trang chủ
• Hướng dẫn học
• Hướng dẫn học jQuery
• .show()

Định nghĩa và sử dụng

• $('p').show("fast");

  1 hiện thành phần phù hợp.
• Thành phần sẽ được hiện giống như được sử dụng

  $('p').show("fast");

  2.

Cấu trúc

.show(Độ bền)Độ bền)

Độ bền có thể bằng số hoặc bằng chữ: slow, fast.

$('p').show(300);

$('p').show("fast");

Bài học chỉ muốn cho bạn hiểu cách sử dụng

$('p').show("fast");

1, muốn biết chi tiết hơn, bạn có thể xem chi tiết thêm tại phần tham khảo.

.show()

Html viết:

  
Click
  
Đây là thành phần được hiện

Hiển thị trình duyệt:

Thành phần đã được hiện bởi

$('p').show("fast");

1.

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery - trước khi click
Click Đây là thành phần được hiện Đây là thành phần được hiện	Click Đây là thành phần được hiện Đây là thành phần được hiện

.show(Độ bền)Độ bền)

Html viết:

  
Click
  
show(2000)
  
show('slow')
  
show()

Hiển thị trình duyệt:

Thành phần đã được hiện bởi

$('p').show("fast");

1.

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery - trước khi click
Click Đây là thành phần được hiện show(2000) show('slow') show()	Click Đây là thành phần được hiện show(2000) show('slow') show()

Click vào từng $('p').show("fast");5 để thấy hiệu ứng.Độ bền,function(){...})

Html viết:

  
Click
  
Thành phần div

Hiển thị trình duyệt:

Thành phần đã được hiện bởi

$('p').show("fast");

1.

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery - trước khi click
Click Đây là thành phần được hiện Thành phần div	Click Đây là thành phần được hiện Thành phần div

• Html viết:
• Hiển thị trình duyệt:
• Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).
• .css('thuộc tính')
• .css()

.css(height) đã lấy giá trị chiều cao của thành phần ul.

• list 01 list 02 list 03 Thành phần ul có chiều cao: style cho thành phần.
• list 01 list 02 list 03 Thành phần ul có chiều cao: 60pxstyle của thành phần.

.css({'thuộc tính 01','thuộc tính 02'})

Sau khi có jQuery - click thành phần listyle cho thành phần:

• list 01 list 02 list 03

• list 01 list 02 list 03 Click từng phần tử li để xem kết quả: width: 80px height: 40px color: rgb(51, 51, 51) background-color: rgb(255, 255, 0)

Trang chủstyle của thành phần:

• list 01 list 02 list 03

list 01 list 02 list 03 Click từng phần tử li để xem kết quả: width: 80px height: 40px color: rgb(51, 51, 51) background-color: rgb(255, 255, 0)thuộc tính','giá trị')

Html viết:

Thành phần p có class
Thành phần p

Hiển thị trình duyệt:

Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).style="color:red".

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery
Thành phần p có class Thành phần p	Thành phần p có class Thành phần p Thành phần p

.css('thuộc tính','function')thuộc tính 01':'giá trị 01','thuộc tính 02':'giá trị 02',...})

Html viết:

Thành phần p có class
Thành phần p

Hiển thị trình duyệt:

Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).style="color:red".

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery
Thành phần p có class Thành phần p	Thành phần p có class Thành phần p Thành phần p

.css('thuộc tính','function')thuộc tính',function(index,giá trị){})

Html viết:

Thành phần p có class
Thành phần p

Hiển thị trình duyệt:

Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).class="test" đã được thêm width với giá trị nhân 2 (*2).

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery
Thành phần p có class Thành phần p	Thành phần p có class Thành phần p Thành phần p

.css('thuộc tính','function')thuộc tính','function')

Html viết:

Thành phần p có class
Thành phần p

Hiển thị trình duyệt:

Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery
Thành phần p có class Thành phần p	Thành phần p có class Thành phần p Thành phần p

.css('thuộc tính','function')thuộc tính')

Html viết:

list 01
list 02
list 03

Thành phần ul có chiều cao: 

Hiển thị trình duyệt:

Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery
Thành phần p có class Thành phần p list 01 list 02 list 03 Thành phần ul có chiều cao:	.css('thuộc tính','function') list 01 list 02 list 03 Thành phần ul có chiều cao: 60px

Html viết:thuộc tính 01','thuộc tính 02'})

Html viết:

$('p').show("fast");

0

Hiển thị trình duyệt:

Ta thấy thành phần p có class="test" đã được thêm width với giá trị cộng thêm 300 (+=300).

So sánh code HTML trước và sau khi có jQuery:

Trước khi có jQuery	Sau khi có jQuery
Thành phần p có class Thành phần p list 01 list 02 list 03	.css('thuộc tính','function') list 01 list 02 list 03 Click từng phần tử li để xem kết quả: width: 80px height: 40px color: rgb(51, 51, 51) background-color: rgb(255, 255, 0)