பயனர்கள் ஒரு தேதியை உள்ளிட வேண்டியிருக்கும் போது, டெவலப்பர்கள் உள்ளீட்டு வகை தேதியின் முன் வரையறுக்கப்பட்ட/இயல்புநிலை மதிப்பை தற்போதைய/இன்றைய தேதிக்கு அமைக்கின்றனர். இப்போது, பயனர் கைமுறையாக தேதியை உள்ளிட வேண்டிய அவசியமில்லை, எனவே அந்த அர்த்தத்தில் அது பயனரின் நேரத்தையும் முயற்சியையும் மிச்சப்படுத்துகிறது. மேலும், இது பயனர் அனுபவத்தை மேம்படுத்துகிறது, தரவுகளின் துல்லியம் மற்றும் பயனர்களுக்கு அதிக வசதியை வழங்குகிறது. இது நிகழ்வு மேலாண்மை அமைப்பு, முன்பதிவு அமைப்பு போன்ற பல்வேறு பயன்பாடுகளைக் கொண்டுள்ளது.
உள்ளீட்டு வகை தேதியின் இயல்புநிலை மதிப்பை இன்றைக்கு எப்படி அமைப்பது என்பதை இந்த வலைப்பதிவு விளக்குகிறது:
- 'valueAsDate' பண்பைப் பயன்படுத்துதல்
- 'toISOSstring()' முறையைப் பயன்படுத்துதல்
- 'getFullYear()' மற்றும் 'padStart()' முறைகளைப் பயன்படுத்துதல்
முறை 1: “valueAsDate” பண்பைப் பயன்படுத்துதல்
' மதிப்புAsDate 'இதன் மூலம் தற்போதைய தேதியை மீட்டெடுக்க சொத்து பயன்படுத்தப்படுகிறது' தேதி() ” செயல்பாடு. இந்தச் செயல்பாடு ஒரு தேதியில் பல்வேறு செயல்பாடுகளைச் செய்யப் பயன்படுகிறது மற்றும் தற்போதைய தேதியைப் பெறுதல், குறிப்பிட்ட தேதியை அமைத்தல், தேதிகளைக் கையாளுதல் போன்றவை.
சிறந்த புரிதலுக்கு கீழே உள்ள குறியீட்டைப் பார்வையிடவும்:
< உடல் >
< div >
< முத்திரை க்கான = 'இன்றைய தேதி' > தேதி ஆகும் முத்திரை >< உள்ளீடு வகை = 'தேதி'
ஐடி = 'இன்றைய தேதி' >
div >
< கையால் எழுதப்பட்ட தாள் >
document.getElementById ( 'இன்றைய தேதி' ) .valueAsDate = புதிய தேதி ( ) ;
கையால் எழுதப்பட்ட தாள் >
உடல் >
மேலே உள்ள குறியீடு துணுக்கில்:
- முதலில், ' <உள்ளீடு> 'குறிச்சொல் உருவாக்கப்பட்டது' வகை 'மற்றும்' ஐடி 'பண்புகள்' தகவல்கள் 'மற்றும்' இன்றைய தேதி ' முறையே. இந்த ' ' குறிச்சொல் வலைப்பதிவு முழுவதும் பயன்படுத்தப்படும்.
- அடுத்து, உள்ளே ' '' என்ற ஐடியைக் கொண்ட HTML உறுப்பைக் குறியிடவும் இன்றைய தேதி '' ஐப் பயன்படுத்தி தேர்ந்தெடுக்கப்பட்டது getElementById() ”முறை.
- அதன் பிறகு, ' மதிப்புAsDate 'சொத்து ஒதுக்கப்பட்டு ஒரு புதிய நிகழ்வாக சேமிக்கப்படுகிறது' தேதி() 'கட்டமைப்பாளர்.
மேலே உள்ள குறியீடு துணுக்கைச் செயல்படுத்திய பிறகு, வலைப்பக்கம் இப்படி இருக்கும்:
உள்ளீட்டு வகை தரவு தற்போதைய/இன்றைய தேதிக்கு இயல்புநிலை மதிப்பை அமைத்திருப்பதை வெளியீடு காட்டுகிறது.
முறை 2: “toISOSstring()” முறையைப் பயன்படுத்துதல்
இயல்புநிலை இன்றைய மதிப்பை அமைப்பதற்கு ' உள்ளீடு ”உறுப்பு முதல் இன்று/தற்போதைய தேதி வரை. ' ஐஎஸ்ஓஸ்ட்ரிங்() ” முறையையும் பயன்படுத்தலாம், சிறந்த விளக்கத்திற்கு கீழே உள்ள குறியீடு துணுக்கைப் பார்வையிடவும்:
< கையால் எழுதப்பட்ட தாள் >கான்ஸ்ட் இன்று = புதிய தேதி ( ) .toISOSstring ( ) .substr ( 0 , 10 ) ;
document.getElementById ( 'இன்றைய தேதி' ) .மதிப்பு = இன்று;
கையால் எழுதப்பட்ட தாள் >
மேலே உள்ள குறியீடு துணுக்கில்:
- முதலாவதாக, புதிய நிகழ்வு ' தேதி() 'கட்டமைப்பாளர் உருவாக்கப்பட்டது. அதன் பிறகு, தேதியின் நிகழ்வை '' ஆக மாற்றவும் ஐஎஸ்ஓ 'தரநிலையைப் பயன்படுத்தி' ஐஎஸ்ஓஸ்ட்ரிங்() ”முறை.
- அடுத்து, '' பயன்படுத்தவும் substr() 'இன் குறியீட்டு எண்களை எடுக்கும் முறை' 0 'மற்றும்' 10 ” ஒரு அளவுருவாக. அதன் பிறகு, இது '' இலிருந்து தொடங்கும் முடிவைக் காட்டுகிறது 0 'குறியீடு' 10 'குறியீடு.
மேலே உள்ள முறையைச் செயல்படுத்திய பிறகு, வலைப்பக்கம் இப்படித் தோன்றும்:
உள்ளீட்டு வகை தரவு தற்போதைய/இன்றைய தேதிக்கு இயல்புநிலை மதிப்பை அமைத்திருப்பதை வெளியீடு காட்டுகிறது.
முறை 3: 'getFullYear()' மற்றும் 'padStart()' முறைகளைப் பயன்படுத்துதல்
இந்த பிரிவில், ' getFullYear() ” முறை தற்போதைய தேதியைப் பிரித்தெடுக்கிறது. ' பாதை தொடக்கம்() 'முறை பயன்படுத்தப்படுகிறது, இது வடிவமைப்பிற்கு உதவுகிறது' தேதி 'இலக்குவில் காட்டப்படும்' வடிவம் உள்ளீடு ”உறுப்பு:
< கையால் எழுதப்பட்ட தாள் >நிலையான தற்போதைய = புதிய தேதி ( ) ;
const நடப்பு ஆண்டு = current.getFullYear ( ) ;
கான்ஸ்ட் நடப்பு-மாதம் = சரம் ( தற்போதைய.getMonth ( ) + 1 ) .padStart ( 2 , '0' ) ;
தற்போதைய நாள் = சரம் ( தற்போதைய.getDate ( ) ) .padStart ( 2 , '0' ) ;
const formattedDate = ` ${தற்போதைய ஆண்டு} - ${தற்போதைய மாதம்} - ${தற்போதைய நாள்} ` ;
const myDateInput = document.getElementById ( 'myDate' ) ;
myDateInput.value = formattedDate;
கையால் எழுதப்பட்ட தாள் >
மேலே உள்ள குறியீடு துணுக்குகளின் விளக்கம் புல்லட் புள்ளிகளில் விவரிக்கப்பட்டுள்ளது:
- முதலில், 'இன் பொருளைச் சேமிக்கும் நிலையான வகை மாறியை உருவாக்கவும். தேதி() 'என்ற பெயருடன் கட்டமைப்பாளர்' தற்போதைய ”.
- அடுத்து, '' பயன்படுத்தவும் getFullYear() 'முறையுடன்' தற்போதைய 'மாறி மற்றும் அதை ஒரு புதிய மாறியில் சேமிக்கவும்' இந்த வருடம் ”.
- பின்னர், கடந்து செல்லவும் ' getMonth() 'முறை மற்றும் மாதத்தை 1 முதல் 12 வரை தொடங்க ஒரு எண்ணைச் சேர்க்கவும்' லேசான கயிறு() 'கட்டமைப்பாளர். பயன்படுத்துவதன் மூலம் இரண்டு எழுத்துகளின் திணிப்பை வழங்கவும் பாதை தொடக்கம்(2, 0) ”. '' என்ற பெயரில் புதிதாக உருவாக்கப்பட்ட மாறியில் வைக்கவும் நடப்பு மாதம் ”.
- அடுத்து, '' ஐப் பயன்படுத்தி தற்போதைய தேதியைப் பெற அதே செயல்முறையைப் பின்பற்றவும் getDate() 'முறை மற்றும் அதை சேமிக்கவும்' தற்போதைய நாள் ” மாறி.
குறியீடு துணுக்குகளைச் செயல்படுத்திய பிறகு, ஒவ்வொரு சந்தர்ப்பத்திலும் வலைப்பக்கம் இப்படித் தோன்றும்:
உள்ளீட்டு வகை தரவு தற்போதைய/இன்றைய தேதிக்கு இயல்புநிலை மதிப்பை அமைத்திருப்பதை வெளியீடு காட்டுகிறது.
முடிவுரை
உள்ளீட்டு வகை தேதி இயல்புநிலை மதிப்பை இன்று/தற்போதைய தேதிக்கு அமைக்க, ' மதிப்புAsDate 'சொத்து,' ஐஎஸ்ஓஸ்ட்ரிங்() 'மற்றும்' getFullYear() ” முறைகளைப் பயன்படுத்தலாம். 'valueAsDate' சொத்தின் விஷயத்தில், ' தேதி() 'கட்டுமானி தேவைப்படும் போது' ஐஎஸ்ஓஸ்ட்ரிங்() 'முறைகள்' substr() தேதியின் ஒரு குறிப்பிட்ட பகுதியை மட்டும் பெறுவதற்கு முறை பயன்படுத்தப்படுகிறது. உள்ளீட்டு வகை தேதி இயல்புநிலை மதிப்பை இன்று/தற்போதைக்கு எவ்வாறு அமைப்பது என்பதை இந்த வலைப்பதிவு விளக்குகிறது.