2010-01-28 38 views
13

Tôi muốn sao chép tất cả css được tính toán của một phần tử và áp dụng nó cho một phần tử khác. Theo kiểu được tính toán, ý tôi là examply nếu chiều rộng của phần tử là 100%, nhưng chiều rộng của nó là 200px, các phần tử được tính toán chiều rộng sẽ là 200px. làm thế nào tôi có thể truy cập tất cả các kiểu này cho một phần tử?cách lấy tất cả các kiểu được tính toán của một phần tử với jQuery?

+1

Tìm thấy câu trả lời cung cấp cho mọi tuyên bố kiểu * [here] (http://stackoverflow.com/questions/2558426/getcomputedstyle-or-cssmap- tuyên bố kiểu-get-every-style # answer-2561294), mà tôi nghĩ là những gì OP cho biết sau này. – Barney

Trả lời

13

sau khi nghiên cứu sâu hơn bằng câu trả lời Majid, tôi phát hiện ra rằng jquery của ".css" phương thức hoàn trả tính phong cách là tốt, và tốt hơn bởi vì nó chiếm sự khác biệt của trình duyệt http://api.jquery.com/css/

+2

Vâng! Tôi ngớ ngẩn quá! Tại sao tôi lại cố lấy cái muỗng để lấy cái đường dài đó. Tinh thần của câu chuyện: Trước khi tìm kiếm ở nơi khác luôn kiểm tra các công cụ bạn đã có. –

+0

@ hakim-sina Bạn có thể giải thích điều này không? Tôi không hiểu làm thế nào để có được phong cách tính toán ở đây với jQuery của 'css()'. – Smamatti

+1

@ Smamatti: bạn có thể cụ thể hơn không? nói chung để có được một phong cách tính toán, ví dụ chiều rộng (ví dụ được đề cập ở trên trong câu hỏi) tất cả những gì bạn cần làm là chuyển nó đến hàm css như sau: var width = $ ("element"). css ("width") –

9

Sử dụng kiểu được tính toán. Dưới đây là hướng dẫn đơn giản: Get Computed Style

Và với jquery, nó có thể giúp bạn tham khảo phần tử nguồn và đích và áp dụng quy tắc css dễ dàng. giả sử bạn chỉ quan tâm đến hai thuộc tính, chiều rộng và chiều cao, sau đó bạn có thể sử dụng mã dọc theo dòng:

var oSource = $('#source'); 
var sWidth = document.defaultView.getComputedStyle(oSource, null).width; 
var sHeight = document.defaultView.getComputedStyle(oSource, null).height; 
$('#target').css('width', sWidth).css('height', sHeight); 
+1

cảm ơn rất nhiều.Tôi nghĩ rằng tôi phải sử dụng nó với currentStyle để hỗ trợ IE, vâng? –

+0

Không chắc chắn về 7, kiểm tra liên kết này về tính tương thích: http://www.quirksmode.org/dom/w3c_css.html –

+0

@ hakim-sina Thay vì làm những việc khác nhau, tại sao không sử dụng jQuery hoặc thư viện khác? – NoBugs

Các vấn đề liên quan