Tiện ích con Javascript ảnh hưởng đến Kiểu trang được nhúng trong

Question

Tôi hiện đang phát triển một tiện ích có thể được nhúng trong một trang. Tuy nhiên, khi được nhúng, nó ảnh hưởng đến kiểu (phông chữ, văn bản, bố cục, v.v.) của trang mà nó được nhúng vào.

Tôi tự hỏi cách khung công cụ và tiện ích con đóng gói các tiện ích của chúng để không ảnh hưởng đến trang nhúng .

Cảm ơn.

Answer 1

Làm cho tiện ích của bạn, nói dưới một div với một Id duy nhất (hoặc lớp nếu có nhiều) ít có khả năng xung đột với những người khác trên trang lưu trữ. Một ví dụ điển hình có thể là #company-widjet-name. Xem cách giao diện người dùng jQuery thực hiện (.ui-widget input).

Sau đó, bạn có thể cần phải thực hiện một loại đặt lại được bản địa hóa, để tránh CSS của trang gốc chèn lên thiết kế của bạn. Sửa đổi một cái gì đó như Eric Meyer's reset cho phù hợp. Vui lòng tránh #uniqueId * { padding: 0, margin: 0 } vì nó có thể gây đau đầu.

Chừng nào bạn làm

#uniqueId a { 
    property: value; 
} 

Độ đặc hiệu nên đủ mạnh để tạo kiểu cho các yếu tố một cách chính xác mà không để cho CSS trang chủ của từ thay đổi nó vô ý.