ਇਹ ਇੱਕ ਵਧੀਆ ਉਦਾਹਰਣ ਹੈ ਤੁਸੀਂ ਆਪਣੇ ਪ੍ਰੋਜੈਕਟਾਂ ਨੂੰ ਸਰਲ ਬਣਾਉਣ ਲਈ ਨੇਟਿਵ HTML ਐਲੀਮੈਂਟਸ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ। ਇੱਥੇ 8 ਐਲੀਮੈਂਟਸ ਹਨ ਜਿਨ੍ਹਾਂ ਦੀ ਵਰਤੋਂ ਤੁਸੀਂ ਕਿਸੇ ਲਾਇਬ੍ਰੇਰੀ ਨੂੰ ਇੰਸਟਾਲ ਕਰਨ ਦੀ ਬਜਾਏ ਕਰ ਸਕਦੇ ਹੋ:
- ਮੋਡਲਜ਼ ਲਈ
<dialog> - ਅਕੋਰਡੀਅਨਜ਼ ਲਈ
<details>ਅਤੇ<summary> - ਪੈਨਲਾਂ ਲਈ
popoverਐਟਰੀਬਿਊਟ - ਡ੍ਰੌਪਡਾਊਨਜ਼ ਅਤੇ ਆਟੋ-ਕੰਪਲੀਟ ਲਈ
<select>ਅਤੇ<datalist> - ਸਲਾਈਡਰਜ਼ ਲਈ
<input type="range"> - ਕਲਰ ਪਿਕਰਜ਼ ਲਈ
<input type="color"> - ਡੇਟ ਪਿਕਰਜ਼ ਲਈ
<input type="date"> - ਲੇਜ਼ੀ ਲੋਡਿੰਗ ਲਈ
loading="lazy"
ਇਹ ਐਲੀਮੈਂਟਸ ਤੁਹਾਨੂੰ ਘੱਟ ਕੋਡ ਲਿਖਣ ਅਤੇ ਰੱਖ-ਰਖਾਅ (maintenance) ਨੂੰ ਘਟਾਉਣ ਵਿੱਚ ਮਦਦ ਕਰ ਸਕਦੇ ਹਨ। ਇਹ ਮੁਫ਼ਤ ਵਿੱਚ ਐਕਸੈਸਬਿਲਟੀ (accessibility) ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਵੀ ਪ੍ਰਦਾਨ ਕਰਦੇ ਹਨ।
ਤੁਸੀਂ ਕਿਸੇ ਲਾਇਬ੍ਰੇਰੀ ਨੂੰ ਇੰਸਟਾਲ ਕੀਤੇ ਬਿਨਾਂ ਆਮ UI ਕੰਪੋਨੈਂਟਸ ਬਣਾਉਣ ਲਈ ਇਹਨਾਂ ਐਲੀਮੈਂਟਸ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ। ਉਦਾਹਰਨ ਲਈ, ਤੁਸੀਂ ਫੋਕਸ ਟ੍ਰੈਪ (focus trap) ਅਤੇ ਸਟਾਈਲਯੇਬਲ ਬੈਕਡ੍ਰੌਪ (styleable backdrop) ਵਾਲੀ ਮੋਡਲ ਵਿੰਡੋ ਬਣਾਉਣ ਲਈ <dialog> ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ।
ਸਰੋਤ: https://dev.to/dimonb19a/8-native-html-elements-you-dont-need-a-library-for-29b4