Onclick thay đổi màu nền JavaScript

Ví dụ

Đặt màu nền cho tài liệu

tài liệu. thân thể. Phong cách. nềnColor = "đỏ";

Tự mình thử »

Thêm các ví dụ "Tự mình thử" bên dưới

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

Thuộc tính backgroundColor đặt hoặc trả về màu nền của phần tử

cú pháp

Trả về thuộc tính backgroundColor

vật. Phong cách. màu nền

Đặt thuộc tính backgroundColor

vật. Phong cách. nềnColor = "màu. trong suốt. ban đầu. thừa kế"

Giá trị tài sản

ValueDescriptioncolorChỉ định màu nền. Xem Giá trị màu CSS để biết danh sách đầy đủ các giá trị màu có thể có trong suốtDefault. Màu nền trong suốt [nội dung bên dưới sẽ tỏa sáng]initialĐặt thuộc tính này thành giá trị mặc định của nó. Đọc về khởi tạo Kế thừa thuộc tính này từ phần tử cha của nó. Đọc về thừa kế

chi tiết kỹ thuật

Giá trị mặc định. minh bạch Giá trị trả về. Một Chuỗi, đại diện cho màu nền Phiên bản CSS SS1

Hỗ trợ trình duyệt

backgroundColor là một tính năng CSS1 [1996]

Nó được hỗ trợ đầy đủ trong tất cả các trình duyệt

ChromeEdgeFirefoxSafariOperaIECóCóCóCóCóCó

Thêm ví dụ

Ví dụ

Đặt màu nền của một cụ thể

thành phần

tài liệu. getElementById["myDiv"]. Phong cách. backgroundColor = "màu xanh nhạt";

Tự mình thử »

Ví dụ

Trả lại màu nền của một cụ thể

thành phần

để màu = tài liệu. getElementById["myDiv"]. Phong cách. màu nền;

Tự mình thử »

Ví dụ

Trả lại màu nền của tài liệu

để màu = tài liệu. thân thể. Phong cách. màu nền;

Tự mình thử »

Bài đăng này cung cấp cái nhìn sâu sắc để hướng dẫn bạn cách thay đổi màu nền bằng cách nhấn nút HTML

Màu nền thay đổi bằng cách nhấp vào nút trong JavaScript như thế nào?

JavaScript đóng vai trò là chất xúc tác với HTML và CSS để cung cấp giao diện tương tác cho trang web. Phần này trình bày mã JavaScript để chuyển đổi màu nền sau khi nhấp vào nút.
Cú pháp thay đổi màu nền trong JavaScript như sau.

cú pháp

tài liệu. getElementById['id'].kiểu dáng . màu nền = 'màu';

Cú pháp được mô tả là

  • backgroundColor đại diện cho thuộc tính để thay đổi màu nền
  • getElementById chỉ định rằng bạn đọc và chỉnh sửa phần tử HTML cụ thể
  • màu biểu thị màu do người dùng xác định để hiển thị

Một ví dụ được đưa ra để chuyển đổi màu nền bằng cách nhấn/nhấp vào nút

Mã số




#DIV {
  width: 400px ;
  chiều cao . 300px ;
  nền - màu . : xanh lục ;
  màu . đen ;
}



Example to change the background color with JavaScript

  Welcome to JavaScript World

Press it

function colorFunction[] {
  document.getElementById["DIV"].kiểu dáng . màu nền = "cam";
}


Mã này được giải thích tại đây

  • Div của tài liệu HTML cho màu nền có chiều rộng và chiều cao lần lượt là 400px và 300px
  • Sau đó, một thông báo được hiển thị với nội dung “Chào mừng đến với Thế giới JavaScript” trong phần được chỉ định
  • Một nút HTML được đính kèm với một thẻ nút được liên kết với phương thức colorFunction[]
  • Sử dụng phương pháp này, màu sắc được thay đổi sau khi nhấn nút “Nhấn nút”
  • Sau khi sự kiện nhấp chuột của nút được gọi, màu sẽ thay đổi thành “cam”

Đầu ra trước khi nhấp vào nút

Ở đầu ra, màu xanh lục xuất hiện trong nền của văn bản “Chào mừng đến với Thế giới JavaScript”. Hơn nữa, một nút HTML “Nhấn nó” được đính kèm

Đầu ra sau khi nhấp vào nút

Khi nhấn nút, màu xanh lục sẽ chuyển sang màu cam như trong hình trên

Phần kết luận

Trong JavaScript, màu nền được thay đổi bằng cách sử dụng thuộc tính tích hợp sẵn của đối tượng ngày tháng. Thuộc tính này có thể được liên kết với một sự kiện khi nhấp vào nút. Khi nhấp vào nút, màu nền sẽ được thay đổi. Đến đây bạn đã biết cách thay đổi màu nền sau khi nhấp vào nút trong JavaScript

Làm cách nào để thay đổi màu nền title trong JavaScript?

Sử dụng Thuộc tính màu nền kiểu HTML DOM để thay đổi màu nền sau khi nhấp vào nút. Thuộc tính này được sử dụng để thiết lập màu nền của một phần tử.

Làm cách nào để thay đổi màu nền trong JavaScript một cách linh hoạt?

Để đạt được điều này, bạn phải đặt --backcol trong hàm var làm giá trị của màu nền nội dung . var inputcolor = tài liệu. getElementById["favcolor"]; . phần tử tài liệu; .

Làm cách nào để thay đổi màu nền trong hàm JavaScript?

Để thay đổi màu nền bằng javascript, bạn có thể áp dụng kiểu. nền hoặc phong cách. màu nền của thành phần bạn muốn thay đổi nền cho . Ví dụ dưới đây thay đổi màu nền của phần thân khi bạn nhấp vào một phần tử bằng cách sử dụng kiểu.

Làm cách nào để thay đổi màu nền của div trong JavaScript?

Thuộc tính màu nền kiểu .
Đặt màu nền cho tài liệu. thân thể. Phong cách. .
Set a background color of a specific
element: getElementById["myDiv"]. style. .. .
Return the background color of a specific
element: let color = document. .. .
Trả lại màu nền của tài liệu. để màu = tài liệu

Chủ Đề