Tiếp cận các nhà cung cấp tiền tố -webkit- trong JavaScript

Question

Nếu tôi được viết một dòng JavaScript để thiết lập thuộc tính style của một phần tử nó có thể giống như thế này (ví dụ này: "width"):

document.getElementById('myDiv').style.width="50px"; 

và nếu có một dấu gạch ngang trong các yếu tố CSS nó sẽ trông như thế này (ví dụ này: "margin-top"):

document.getElementById('myDiv').style.marginTop="15px"; 

Nhưng làm thế nào để truy cập vào các tiền tố -webkit-, nếu tôi muốn để cho nó một phong cách như thế này ví dụ:

{-webkit-transition: width 1s;} 

Answer 1

Bạn có hai lựa chọn:

• style["-webkit-transition"]
• style.WebkitTransition

Đầu tiên trực tiếp hoạt động. Ký hiệu thứ hai được gọi là trường hợp lạc đà và foo-bar-baz trở thành fooBarBaz. Kết quả là, khi một chuỗi trường hợp không lạc quan bắt đầu bằng -, chữ cái đầu tiên được viết hoa trong trường hợp lạc đà.

Answer 2

Một khả năng sẽ sử dụng ví dụ jquery, để làm cho nó dễ dàng. Nếu bạn muốn có một giải pháp javascript tinh khiết, sau đó đọc này: http://www.javascriptkit.com/javatutors/setcss3properties.shtml

Answer 3

Nếu bạn không muốn giữ lại đào lên những đặc tính phong cách pesky và quy ước đặt tên của họ, bạn luôn có thể sử dụng jQuery để giữ cho nó đơn giản.

$('#myDiv').css("-webkit-transition", "value");