Một số nhà phát triển đã tự hỏi làm thế nào để suy thoái một cách duyên dáng nên được tiếp cận trong các yếu tố tùy chỉnh (hoặc các phần tử Polymer). Điều này là dành cho trường hợp sử dụng khi một trong hai polyfills không được sử dụng, các thành phần Web không được hỗ trợ hoặc JavaScript chỉ đơn giản là tắt.Duyên dáng làm suy giảm một phần tử tùy chỉnh (hoặc phần tử Polymer)
Có ai có suy nghĩ về cách thực hiện việc này không?
Tôi nghĩ điều đó là hợp lý. Đây là cách hầu hết các phần tử HTML (không phải tất cả) hoạt động. Kiểm tra vụ nổ này từ quá khứ: http://code.tutsplus.com/tutorials/quick-tip-html5-video-with-a-fallback-to-flash--net-9982
Có hai loại yếu tố tùy chỉnh mà chúng tôi thường quan tâm để thêm hỗ trợ cho sự xuống cấp duyên dáng: Các yếu tố tùy chỉnh mở rộng thẻ HTML gốc và Yếu tố tùy chỉnh không.
Yếu tố tùy chỉnh hỗ trợ các phần tử nguyên bản mở rộng đã được nướng vào nền tảng (ví dụ: <button>, <input>). Một cách để làm điều này là sử dụng cú pháp is. Vì vậy, nếu bạn đang mở rộng một built-in, tôi tin rằng cách trực tiếp nhất để đảm bảo sự xuống cấp duyên dáng là sử dụng cú pháp is như sau: <button is="my-button"> thay vì <my-button></my-button>.
Một số ví dụ về nơi tôi có thể thấy điều này làm việc tốt là:
Fancy lĩnh vực đầu vào:
<input is="fancy-input" type="text" value="So fancy">
Tuỳ chơi video:
<video is="custom-player" src="amazeballs.mp4">
Âm nhạc visualizers:
<audio is="music-visualizer" src="track.ogg">
Bằng cách này nếu trình duyệt không có Phần tử tùy chỉnh không thể hiểu được cú pháp is, phần tử đang mở rộng vẫn hoạt động với trải nghiệm bị suy giảm.
Điều gì về các yếu tố tùy chỉnh mà bạn không mở rộng một built-in cụ thể? Ví dụ: <my-preload-animation>.
Một cách tiếp cận tôi đã được thực hiện để xác định đây là nội dung dự phòng trong DOM sáng:
<my-preload-animation>
Loading...
</my-preload-animation>
Nếu một trình duyệt không hỗ trợ chỉnh Yếu tố giải thích lý thẻ dưới dạng HTMLUnknownElement, dự phòng (nhắn tải) sẽ vẫn được trả lại. Điều này (xuất hiện) để làm việc cho các phần tử đơn giản.
Đối với những phức tạp hơn (ví dụ: nếu bạn đang sử dụng <content>/<shadow> trong phần tử của mình), tôi xóa dự phòng thông qua tập lệnh khi phần tử tùy chỉnh của tôi được nâng cấp.