কাস্টম উপাদানসমূহ কি বৈধ HTML5?

180

এইচটিএমএল 5 এ কাস্টম ট্যাগগুলি বৈধ কিনা এই বিষয়ে আমি একটি নির্দিষ্ট উত্তর পেতে অক্ষম হয়েছি:

<greeting>Hello!</greeting>

আমি একরকম বা অন্য কোনও উপায়ে কিছুই খুঁজে পাইনি:

http://dev.w3.org/html5/spec/single-page.html

এবং কাস্টম ট্যাগগুলি ডাব্লু 3 সি বৈধকারীর সাথে বৈধতা দেয় বলে মনে হয় না।

html  custom-element 
— D13
সূত্র
2
আপনি 4.5 বছর আগে রচিত একটি HTML5 নিবন্ধে খুব বেশি স্টক রাখতে চাইবেন না।
— জেসেগাভিন
9
ক্রকফোর্ডের নিবন্ধটি একটি বিজোড় বিষয়। গুরুত্বপূর্ণ বাক্যটি হ'ল "এটি হ'ল আমার প্রতিযোগী , মৃদু এইচটিএমএল 5 এর জন্য প্রস্তাব "। অন্য কথায়, এটি আমরা আজ জানি এইচটিএমএল 5 নয়, তবে এইচটিএমএল 4 এর উত্তরসূরি হিসাবে আলাদা এইচটিএমএল 5 এর প্রস্তাব, কারণ এটি ২০০ 2007 সালের নভেম্বর, যখন ডাব্লু 3 সি ইতিমধ্যে প্রায় এক বছর ধরে এইচটিএমএল 5 এ কাজ করে চলেছিল because । তাঁর এখানে "অনুমোদিত" শব্দটির ব্যবহার বিভ্রান্তিকর। কাস্টম ট্যাগগুলি কখনই "মেনে চলা" / "বৈধ" হয় নি, তবে ব্রাউজার পার্সাররা তাদের উপস্থিতিতে কাজ চালিয়ে যায়। যাইহোক, ক্রকফোর্ডের প্রস্তাব মোটেও কোনও আকর্ষণ লাভ করে নি। সবেমাত্র এর কোনও অংশই HTML5 তে সংহত করা হয়েছে।
— আলোচি
3
কাস্টম উপাদানগুলি এখন প্রথম শ্রেণিতে পরিণত হচ্ছে যে ওয়েব উপাদানগুলির জন্য উদীয়মান ডাব্লু 3 মান ফায়ারফক্স এবং ক্রোমে প্রবেশ করতে শুরু করেছে: dvcs.w3.org/hg/webcompাংশ
— raw-
3
ডগলাস ক্রকফোর্ডের জন্য, আমি তাঁর সমস্ত কথা বিশ্বাস করার জন্য প্রলুব্ধ হয়েছি।
— আর্টিস্টেক্স
1
কাস্টম উপাদানের জন্য ওয়েব ব্রাউজার সমর্থন টেবিল caniuse.com/#feat=custom-elements
— Adrien হউন

উত্তর:

169

কাস্টম উপাদানসমূহ স্পেসিফিকেশন ক্রোম এবং অপেরা পাওয়া যায়, এবং পাওয়া হয়ে উঠছে অন্যান্য ব্রাউজার । এটি একটি আনুষ্ঠানিক পদ্ধতিতে কাস্টম উপাদানগুলিকে নিবন্ধিত করার একটি উপায় সরবরাহ করে।

কাস্টম উপাদানগুলি নতুন ধরণের DOM উপাদান যা লেখক দ্বারা সংজ্ঞায়িত করা যায়। ভিন্ন টেকনিক , যা আড়ম্বরহীন এবং ক্ষণজীবী হয়, কাস্টম উপাদান রাষ্ট্র encapsulate এবং স্ক্রিপ্ট ইন্টারফেস প্রদান করতে পারেন।

কাস্টম উপাদানগুলি টেমপ্লেটস, এইচটিএমএল আমদানি এবং শ্যাডো ডিওএম সহ একটি বড় ডাব্লু 3 স্পেসিফিকেশনের একটি অংশ Web

ওয়েব উপাদান লেখকরা কেবলমাত্র CSS এর মাধ্যমে সম্ভব নয় এমন এক স্তরের ভিজ্যুয়াল সমৃদ্ধি এবং ইন্টারঅ্যাক্টিভিটি সহ উইজেটগুলি সংজ্ঞায়িত করতে সক্ষম করে এবং স্ক্রিপ্ট লাইব্রেরিগুলির সাথে রচনাটির সহজতরকরণ এবং পুনরায় ব্যবহার সম্ভব নয়।

যাইহোক, নিবন্ধের মাধ্যমে এই দুর্দান্ত পদচারণা থেকে কাস্টম এলিমেন্টস ভি 1 সম্পর্কে গুগল বিকাশকারীদের পদক্ষেপটি থেকে:

একটি কাস্টম উপাদানটির নাম অবশ্যই একটি ড্যাশ ( -) থাকতে পারে । সুতরাং <x-tags>, <my-element>এবং <my-awesome-app>সমস্ত বৈধ নাম, যখন <tabs>এবং <foo_bar>নেই। এই প্রয়োজনীয়তা তাই এইচটিএমএল পার্সার নিয়মিত উপাদানগুলির থেকে কাস্টম উপাদানগুলিকে আলাদা করতে পারে। এটিএমএলটিতে নতুন ট্যাগ যুক্ত করা হলে এটি সামনের সামঞ্জস্যতাও নিশ্চিত করে।

কিছু সংস্থান

— jessegavin
সূত্র
3
এটি একটি ভাল উত্তর (+1) তবে নিয়মটি কিছুটা বিজ্ঞপ্তিযুক্ত। "ব্যবহারকারীদের এমন কিছু করা উচিত নয় যা অনুমোদিত নয় ..."
— আলহকি
8
@ অলোকি আপনার পরবর্তী উক্তিটি আপনার উক্তিতে যুক্ত করা উচিত: "এই স্পেসিফিকেশন দ্বারা"।
— জেসেগাভিন
1
আমি অনুমানের সেই অংশটিও পড়েছি এবং এটি আমাকে সত্যই বিভ্রান্ত করেছে। এখানে কেন: 1) কাস্টম বৈশিষ্ট্যগুলি HTML5 এ অনুমোদিত। এটি আলোচির বিজ্ঞপ্তি যুক্তি পর্যবেক্ষণের বিষয়টি নিশ্চিত করে। 2) কোথাও অনুমানটি বলে না যে কাস্টম উপাদানগুলির অনুমতি নেই।
— d13
এই উদ্ধৃতিটি সর্বোপরি অস্পষ্ট। নিশ্চয়ই ডাব্লু 3 সি এর একটি উপায়ে আরও কংক্রিট অবস্থান রয়েছে নাকি অন্যভাবে?
— ফ্ল্যাশ করুন
2
ग्राहकমেন্টস.ইউ-র লিঙ্কটি আর কার্যকর হয় না। আপনি এটি আপডেট / মুছে ফেলা আপত্তি করতে চান?
— নিসারগ
22

এটি সম্ভব এবং অনুমোদিত:

ব্যবহারকারী এজেন্টদের অবশ্যই এমন উপাদান এবং বৈশিষ্ট্যগুলি চিকিত্সা করতে হবে যা তারা শব্দার্থগতভাবে নিরপেক্ষ হিসাবে বুঝতে পারে না; এগুলিকে ডিওমে রেখে (ডিওএম প্রসেসরের জন্য) এবং সিএসএস অনুসারে এগুলি স্টাইলিং (সিএসএস প্রসেসরের জন্য), তবে তাদের কাছ থেকে কোনও অর্থ অনুমান করা যায় না।

http://www.w3.org/TR/html5/infrastructure.html#extensibility-0

তবে, আপনি যদি ইন্টারঅ্যাক্টিভিটি যুক্ত করতে চান, তবে আই এর and এবং ৮ এর জন্য আপনার ডকুমেন্টটি অবৈধ (তবে এখনও সম্পূর্ণ কার্যকরী) করা দরকার।

দেখুন http://blog.svidgen.com/2012/10/building-custom-xhtml5-tags.html (আমার ব্লগ)

— svidgen
সূত্র
দেখে মনে হচ্ছে আপনি পুরো বিভাগটি পড়েন নি। এটি কেবলমাত্র বৈশিষ্ট্য সম্পর্কেই নয় , এটি কাস্টমাইজেশনকে দৃ strongly়ভাবে নিরুৎসাহিত করে।
— অ্যান্ড্রু বারবার
আমার অন্যান্য মন্তব্যগুলি পুনরাবৃত্তি করছে, হ্যাঁ, আমি দুঃখিত এটি আমার ব্লগটি বোঝাতে জানতাম না। আমি ধরে নিয়েছি যে অনেক কিছুই সুস্পষ্ট ছিল। নিবন্ধ যদিও সরাসরি প্রাসঙ্গিক। এবং আমি যুক্ত করব, এটি আমার দ্বারা প্রকাশিত কোনও "দাবি" ব্যাক আপ করার জন্য একটি রেফারেন্স হিসাবে পরিবেশন করা নয়, তবে কীভাবে এটি কাজ করে তা কীভাবে করতে হবে তা দীর্ঘ ফর্ম্যাটে দেখানো ।
— এসভিডজেন
1
মূল কথাটি হ'ল স্পেসিফিকেশন এই বিষয়গুলিকে স্পষ্টভাবে মঞ্জুরি দেয়। এবং নিরুৎসাহজনক আচরণের বেশিরভাগ প্রসঙ্গে , স্পেসিফিকেশনটি স্পষ্টতই ব্যবহারকারী-এজেন্ট বিক্রেতাদের সাথে কথা বলছে, এইচটিএমএল লেখককে নয়।
— এসভিডজেন
3
এই বিবৃতি hereabove উদ্ধৃত সাম্প্রতিকতম সংস্করণে সরানো হয়েছে মনে হচ্ছে, w3.org/TR/html5/introduction.html#extensibility । এখনও অবধি, হাই-হাইফেনটেড কাস্টম এইচটিএমএল উপাদানগুলির ব্যবহার বৈধ হতে পারে কিনা বা হাইফেনেটেড কাস্টম এইচটিএমএল উপাদানগুলি কার্যকর করার জন্য আপনার জেএস স্টেটমেন্টের প্রয়োজন কিনা সে বিষয়ে কোনও নথিপত্র আমি এখনও খুঁজে পাচ্ছি না ( html5rocks.com/en/tutorials/webcompferences/ ગ્રાહক )
— জন স্লেজার
@ জনস্লিজার হ্যাঁ, মনে হচ্ছে এটি ডকুমেন্টেশন এবং / অথবা অ্যাঙ্করিংটি কিছুটা পুনরায় সাজানো হয়েছিল। আমি লিঙ্কটি আপডেট করেছি। আমার উত্তরের উদ্ধৃতিটি লিঙ্ক-টু এক্সটেনসিবিলিটি বিভাগের নীচে অবস্থিত ।
— এসভিডজেন
14

এনবি নীচের উত্তরটি যখন এটি 2012 সালে লেখা হয়েছিল তখন সঠিক ছিল then তখন থেকে বিষয়গুলি কিছুটা এগিয়ে যায়। এইচটিএমএল স্পেসটি এখন দুটি ধরণের কাস্টম উপাদানকে সংজ্ঞায়িত করে - "স্বায়ত্তশাসিত কাস্টম উপাদানসমূহ" এবং "স্বনির্ধারিত অন্তর্নির্মিত উপাদানগুলি"। প্রাক্তনটি যে কোনও জায়গায় যেতে পারে ফ্রেসিং সামগ্রীটি প্রত্যাশিত; যা দেহের অভ্যন্তরে বেশিরভাগ জায়গাগুলি, তবে উদাহরণস্বরূপ উল বা ওল উপাদানগুলির বাচ্চা বা টিডি, থম বা ক্যাপশন উপাদান ছাড়া অন্য টেবিল উপাদানগুলিতে নয়। পরে যে স্থানে যেতে পারে তারা সর্বদা যে উপাদানটিকে প্রসারিত করে সেগুলি যেতে পারে।

এটি আসলে উপাদানগুলির সামগ্রী মডেল সঞ্চারের একটি পরিণতি।

উদাহরণস্বরূপ, মূল উপাদানটি অবশ্যই একটি htmlউপাদান হতে হবে ।

htmlউপাদান শুধুমাত্র থাকতে পারে একটি মাথা উপাদান একটি শরীরের উপাদান অনুসরণ।

bodyউপাদানটিতে কেবল ফ্লো সামগ্রী থাকতে পারে যেখানে প্রবাহের সামগ্রী উপাদান হিসাবে সংজ্ঞায়িত করা হয়: এ, আব্বার, ঠিকানা, এলাকা (এটি যদি মানচিত্রের উপাদানটির বংশধর হয়), নিবন্ধ, একপাশে, অডিও, বি, বিডি, বিডো, ব্লককোট, বিআর, বোতাম, ক্যানভাস, সাইট, কোড, কমান্ড, ডেটালিস্ট, দেল, বিশদ , ডিএফএন, ডিভি ডিএল, এম, এম্বেড, ফিল্ডসেট, চিত্র, পাদচরণ, ফর্ম, এইচ 1, এইচ 2, এইচ 3, এইচ 4, এইচ 5, এইচ 6, শিরোনাম, এইচআরগ্রুপ, এইচআর, আই, আইফ্রেমে, আইএমজি, ইনপুট, ইনস, কেবিডি, কীজেন, লেবেল, মানচিত্র, চিহ্ন, গণিত, মেনু, মিটার, এনএভি, নোগ্রিপ্ট, অবজেক্ট, ওল, আউটপুট, পি, প্রাক, অগ্রগতি, কিউ, রুবি, এস, স্যাম্প, স্ক্রিপ্ট, বিভাগ, নির্বাচন করুন, ছোট, স্প্যান, শক্তিশালী, স্টাইল ( যদি স্কোপযুক্ত বৈশিষ্ট্য উপস্থিত থাকে), সাব, সাপ, এসভিজি, টেবিল, টেক্সারিয়া, সময়,u, ul, var, ভিডিও, wbr এবং পাঠ্য

ইত্যাদি।

কোনও বিন্দুতে বিষয়বস্তু মডেলটি বলে না যে "আপনি নিজের পছন্দ মতো কোনও উপাদান রাখতে পারেন", যা কাস্টম উপাদান / ট্যাগগুলির জন্য প্রয়োজনীয়।

— Alohci
সূত্র
ঠিক আছে, সুতরাং আমরা ধরে নিতে পারি যে যদি কাস্টম উপাদানগুলির উল্লেখ না করা হয় তবে তাদেরও অনুমতি দেওয়া হয় না। এটি যথেষ্ট ন্যায্য বলে মনে হচ্ছে।
— d13
4
এই উত্তরটি এখন অবৈধ, উদীয়মান ডাব্লু 3 ওয়েব উপাদান কাস্টম এলিমেন্টস স্ট্যান্ডার্ড এখন ব্রাউজারগুলিতে অবতরণ করতে শুরু করেছে: dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/custom/…
— csuwldcat
1
@ csuwldcat - আসলে না। এই জাতীয় কাস্টম উপাদানগুলিকে এর সামগ্রীর মডেলের অংশ হতে না দেওয়ার জন্য এইচটিএমএল 5 বা পরবর্তী মানকটিকে এখনও কিছু উপায়ে আপডেট করার প্রয়োজন হবে। যদিও এটি আকর্ষণীয় খবর। আমি কোন ব্রাউজারগুলিতে সেগুলি ব্যবহার করতে পারি?
— আলোচি
3
@ অালোচি - স্পষ্টতই এই নতুন বাস্তবতা প্রতিফলিত করার জন্য পুরাতন ভাষার সাথে অন্য কোনও চশমা আপডেট করা দরকার, তবে এইচটিএমএল একটি জীবনযাত্রার মান, এবং অন্যান্য চশমাগুলিকে অবরুদ্ধ করে না - আমরা স্ট্যান্ডার্ডের পরবর্তী পর্যায়ে চলে গেলে আপডেটগুলি করা হবে will ট্র্যাক। আপনি ক্রোম ক্যানারি এবং শীঘ্রই ফায়ারফক্স অরোরায় ওয়েব উপাদানগুলির স্থানীয় প্রয়োগগুলি নিয়ে ঘুরে আসতে পারেন। অতিরিক্তভাবে, আজকের সমস্ত আধুনিক ব্রাউজারগুলিতে খুব ভালভাবে কাজ করে এমন 4 টি ওয়েব উপাদান স্পেসের মধ্যে 3 টির জন্য পলিফিলগুলি পাওয়া যায় - এতে কাস্টম উপাদানসমূহের বৈশিষ্ট্য / বৈশিষ্ট্যগুলি অন্তর্ভুক্ত রয়েছে।
— csuwldcat
সুতরাং কাস্টম উপাদান নির্দিষ্ট জায়গায় রাখা যেতে পারে? বা আপনি কি বলছেন যে তাদের মোটেই অনুমোদিত নয়?
— মেলাব
12

বেসিক কাস্টম উপাদান এবং বৈশিষ্ট্য

কাস্টম উপাদান এবং বৈশিষ্ট্য এইচটিএমএলে বৈধ, প্রদত্ত যে:

  • এলিমেন্টের নামগুলি ছোট হাতের এবং এটি দিয়ে শুরু হয় x-
  • বৈশিষ্ট্যগুলির নামগুলি ছোট হাতের এবং এটি দিয়ে শুরু হয় data-

উদাহরণস্বরূপ, <x-foo data-bar="gaz"/>বা<br data-bar="gaz"/> ।

উপাদানগুলির জন্য একটি সাধারণ সম্মেলন হ'ল x-foo;x-vendor-featureসুপারিশকৃত.

এটি বেশিরভাগ ক্ষেত্রেই পরিচালনা করে, কারণ এটি বিতর্কিতভাবে বিরল যে কোনও বিকাশকারীকে তার উপাদানগুলির নিবন্ধীকরণের জন্য আসা সমস্ত শক্তির প্রয়োজন হবে। বাক্য গঠনটিও পর্যাপ্ত বৈধ এবং স্থিতিশীল। আরও বিস্তারিত ব্যাখ্যা নীচে।

উন্নত কাস্টম উপাদান এবং বৈশিষ্ট্য

2014 হিসাবে, কাস্টম উপাদান এবং বৈশিষ্ট্যগুলি নিবন্ধ করার জন্য একটি নতুন, বহুল উন্নত উপায় রয়েছে। এটি IE 9 বা ক্রোম / ফায়ারফক্স 20 এর মতো পুরানো ব্রাউজারগুলিতে কাজ করবে না But তবে এটি আপনাকে স্ট্যান্ডার্ড HTMLElementইন্টারফেস ব্যবহার করতে , সংঘর্ষগুলি রোধ করতে, অ- ব্যবহার করার অনুমতি দেয়x-* ও- data-*নাম ব্যবহার করতে এবং ব্রাউজারের সম্মানের জন্য কাস্টম আচরণ এবং বাক্য গঠন সংজ্ঞায়িত । নীচের লিঙ্কগুলিতে বিস্তারিত হিসাবে এটির জন্য কিছুটা অভিনব জাভাস্ক্রিপ্টের প্রয়োজন।

এইচটিএমএল 5 রকস - এইচটিএমএল ওয়েবকম্পোন্টগুলিজে নতুন উপাদান নির্ধারণ করা
- কাস্টম উপাদানগুলির পরিচিতি
3 সি এর - ওয়েব উপাদানগুলি: কাস্টম উপাদানসমূহ

বেসিক সিনট্যাক্সের বৈধতা সম্পর্কিত

ব্যবহার data-* কাস্টম অ্যাট্রিবিউট নামের জন্য কিছু সময়ের জন্য পুরোপুরি বৈধ হয়েছে, এবং এমনকি HTML- এর পুরোনো সংস্করণগুলি সাথে কাজ করে।

ডাব্লু 3 সি - এইচটিএমএল 5: এক্সটেনসিবিলিটি

কাস্টম (নিবন্ধভুক্ত) উপাদানগুলির নাম হিসাবে, ডাব্লু 3 সি তাদের বিরুদ্ধে দৃ strongly়ভাবে সুপারিশ করে, এবং তাদের অ-অনুসারী হিসাবে বিবেচনা করে। তবে ব্রাউজারগুলি তাদের সমর্থন করার জন্য প্রয়োজন, এবংx-* সনাক্তকারীরা ভবিষ্যতের এইচটিএমএল স্পেস এবং এর সাথে বিরোধ করবে নাx-vendor-feature সাথে বিরোধ করবে না সনাক্তকারীরা অন্যান্য বিকাশকারীদের সাথে বিরোধ করবে না। যে কোনও পিকি ব্রাউজারের চারপাশে কাজ করার জন্য একটি কাস্টম ডিটিডি ব্যবহার করা যেতে পারে।

অফিসিয়াল ডক্স থেকে কিছু প্রাসঙ্গিক অংশ এখানে দেওয়া হয়েছে:

"প্রযোজ্য স্পেসিফিকেশনগুলি নতুন ডকুমেন্টের সামগ্রী (উদাহরণস্বরূপ একটি ফুবার উপাদান) সংজ্ঞায়িত করতে পারে [...] যদি প্রদত্ত অনুসারে HTML5 নথিটির বাক্য গঠন এবং শব্দার্থতত্ত্ব প্রয়োগযোগ্য স্পেসিফিকেশন (গুলি) ব্যবহার করে অপরিবর্তিত থাকে, তবে সেই দস্তাবেজটি মেনে চলতে হবে HTML5 নথি। "

"ব্যবহারকারী এজেন্টদের অবশ্যই এমন উপাদান এবং বৈশিষ্ট্যগুলির চিকিত্সা করতে হবে যা তারা শব্দার্থগতভাবে নিরপেক্ষ হিসাবে বুঝতে পারে না; এগুলি ডিওএম (ডিওএম প্রসেসরের জন্য) এ রেখে, এবং সেগুলি সিএসএস (সিএসএস প্রসেসরের জন্য) অনুসারে স্টাইলিং করতে হবে, তবে তাদের কাছ থেকে কোনও অর্থ বের করে না।"

"ব্যবহারকারী এজেন্টরা অনুগ্রহপূর্বক নথিগুলি যেমন খুশি তেমন হ্যান্ডেল করতে পারেন না; এই স্পেসিফিকেশনে বর্ণিত প্রসেসিং মডেল ইনপুট নথির সঙ্গতি নির্বিশেষে বাস্তবায়নগুলিতে প্রযোজ্য" "

"এইচটিএমএল অজানাএলমেন্ট ইন্টারফেসটি অবশ্যই এইচটিএমএল উপাদানগুলির জন্য ব্যবহার করা উচিত যা এই স্পেসিফিকেশন দ্বারা সংজ্ঞায়িত হয় না" "

ডাব্লু 3 সি - এইচটিএমএল 5: ডকুমেন্টসটি
কনফার্মিং হোয়াটডাব্লুজি - এইচটিএমএল স্ট্যান্ডার্ড: ডোম উপাদানসমূহ

— Beejor
সূত্র
11

আমি উল্লেখ করতে চাই যে "বৈধ" শব্দের এই প্রসঙ্গে দুটি ভিন্ন অর্থ হতে পারে, যার মধ্যে দুটি সম্ভাব্য, আম, বৈধ।

  1. কাস্টম ট্যাগ সহ এইচটিএমএল ডকুমেন্টকে বৈধ এইচটিএমএল 5 হিসাবে বিবেচনা করা উচিত? এর উত্তর পরিষ্কারভাবে "না" is কোন বৈশিষ্ট্যটি সঠিকভাবে ট্যাগগুলির তালিকা অনুসারে লিখিত রয়েছে। এ কারণেই কোনও এইচটিএমএল বৈধকারক কাস্টম ট্যাগ সহ, বা ভুল জায়গায় মানক ট্যাগ সহ (শিরোনামে "img" ট্যাগের মতো) কোনও নথি গ্রহণ করবে না।

  2. কাস্টম ট্যাগ সহ একটি এইচটিএমএল নথি ব্রাউজারগুলির জুড়ে কোনও স্ট্যান্ডার্ড, স্পষ্টভাবে সংজ্ঞায়িত উপায়ে পার্স এবং রেন্ডার করা যাবে? এখানে, সম্ভবত আশ্চর্যরূপে উত্তরটি হ্যাঁ "হ্যাঁ"। যদিও দস্তাবেজটি প্রযুক্তিগতভাবে বৈধ এইচটিএমএল 5 হিসাবে বিবেচিত হবে না, এইচটিএমএল 5 স্পষ্টটি নির্দিষ্ট করে যে ব্রাউজাররা যখন কাস্টম ট্যাগ দেখেন তখন তাদের ঠিক কী করা উচিত: সংক্ষেপে, কাস্টম ট্যাগটি এর মতো কাজ করে <span>- এর অর্থ কিছুই না এবং কিছুই করে না ডিফল্ট, তবে এটি এইচটিএমএল দ্বারা স্টাইল করা যেতে পারে এবং জাভাস্ক্রিপ্ট দ্বারা অ্যাক্সেস করা যায়।

— তামাশা
সূত্র
5

কাস্টম এইচটিএমএল উপাদানগুলি একটি উদীয়মান ডাব্লু 3 স্ট্যান্ডার্ড যা আমি অবদান রেখে চলেছি যা আপনাকে পার্সারের সাহায্যে কাস্টম উপাদানগুলি ঘোষণা করতে এবং নিবন্ধিত করতে সক্ষম করে, আপনি এখানে স্পেকটি পড়তে পারেন: ডাব্লু 3 ওয়েব উপাদান কাস্টম এলিমেন্টস স্পেস । অতিরিক্ত হিসাবে, মাইক্রোসফ্ট একটি লাইব্রেরি সমর্থন করে (প্রাক্তন মজিলা দেবগণ দ্বারা লিখিত), এক্স-ট্যাগ - এটি ওয়েব উপাদানগুলির সাথে কাজ করা আরও সহজ করে তোলে।

— csuwldcat
সূত্র
1
এই খসড়াটি কি পাস হয়েছে?
— স্টারেক্স
অংশ Firefox এবং Chrome এ অবতরণ হয় - আমরা একসাথে ঘনিষ্ঠভাবে কাজ করছে এবং সম্পূর্ণ বাস্তবায়নের আছে আশা 2013 সালের শেষ নাগাদ অবতরণ করেছে
— csuwldcat
1
এখন 2014, সম্পূর্ণ বাস্তবায়ন অবতরণ করেছে?
— হাসিব মাহমুদ
1
@ জমিহুটবার এবং এখন থেকে এক বছর আপনার ওয়েবপৃষ্ঠাগুলি সর্বশেষতম ব্রাউজারগুলিতে ভাঙ্গতে দেখুন। ব্রাউজার আন্তঃব্যবহারযোগ্যতার জন্য # 1 বিধি: বিধি দ্বারা খেলুন।
— মিস্টার লিস্টার
1
@ হাশিবমাহমুদ স্পেসগুলি এখন চূড়ান্ত হয়ে গেছে, এবং কয়েক সপ্তাহের মধ্যে ফায়ারফক্স অরোরা Chrome সপ্তাহের মধ্যে ক্রোম বিটাতে পৌঁছাবে। আপনি কনফিগ ফ্ল্যাগ আলোকসম্পাতের দ্বারা আজ ফায়ারফক্স অররা তাদের ব্যবহার করতে পারেন dom.webcomponents.enabledথেকে true।
— csuwldcat
4

আধুনিক পৃষ্ঠাগুলি প্রতিফলিত একটি আপডেট উত্তর দিতে।

কাস্টম ট্যাগগুলি বৈধ হয় যদি হয়,

1) তারা একটি ড্যাশ ধারণ করে 

<my-element>

2) তারা এক্সএমএল এম্বেড করা হয় 

<greeting xmlns="http://example.com/customNamespace">Hello!</greeting>

এটি ধরে নেওয়া হয় আপনি HTML5 ডক্টিপ ব্যবহার করছেন <!doctype html>

এই সাধারণ নিষেধাজ্ঞাগুলি বিবেচনা করে এখন আপনার এইচটিএমএল মার্কআপকে বৈধ রাখতে আপনার যথাসাধ্য চেষ্টা করা বুদ্ধিমান হয়েছে (দয়া করে ট্যাগগুলি বন্ধ করে দেওয়া বন্ধ করুন <img>এবং<hr> , এটি যদি আপনি কোনও এক্সএইচটিএমএল ডক্টিপ ব্যবহার না করেন তবে এটি সম্ভবত নির্বোধ এবং ভুল), যার সম্ভবত আপনার কোনও প্রয়োজন নেই।

এইচটিএমএল 5 পার্সিংয়ের নিয়মকে স্পষ্টভাবে সংজ্ঞায়িত করেছে এমন একটি মঞ্জুরিপ্রাপ্ত ব্রাউজার এটি কঠোরভাবে বৈধ না হলেও এমনকি আপনি যে কোনও ট্যাগ এতে ফেলেছেন তা হ্যান্ডেল করতে সক্ষম হবে able

— হেনরিক ভেন্ডেলবো
সূত্র
3

এইচটিএমএল 5 নির্দিষ্টকরণের এক্সটেনসিবিলিটি বিভাগ থেকে উদ্ধৃতি দেওয়া :

মার্কআপ-স্তরের বৈশিষ্ট্যগুলির জন্য যা এক্সএমএল সিরিয়ালাইজেশনের মধ্যে সীমাবদ্ধ হতে পারে এবং এইচটিএমএল সিরিয়ালাইজেশনে সমর্থন করা উচিত নয়, বিক্রেতাদের কাস্টম নেমস্পেসগুলি সংজ্ঞায়িত করতে নেমস্পেস প্রক্রিয়াটি ব্যবহার করা উচিত যেখানে অ-মানক উপাদান এবং বৈশিষ্ট্যগুলি সমর্থন করে।

সুতরাং আপনি যদি এইচটিএমএল 5 এর এক্সএমএল সিরিয়ালাইজেশন ব্যবহার করেন তবে এটির মতো কিছু করার জন্য এটি আপনার আইনী:

<greeting xmlns="http://example.com/customNamespace">Hello!</greeting>

তবে, আপনি যদি এইচটিএমএল সিনট্যাক্স ব্যবহার করেন তবে আপনি যা করতে পারেন তার মধ্যে আপনি আরও সীমাবদ্ধ।

এইচটিএমএল সিনট্যাক্সের সাথে ব্যবহারের উদ্দেশ্যে চিহ্নিত মার্কআপ-স্তরের বৈশিষ্ট্যগুলির জন্য, এক্সটেনশানগুলি "এক্স-বিক্রেতা-বৈশিষ্ট্য" ফর্মটির নতুন বৈশিষ্ট্যগুলিতে সীমাবদ্ধ হওয়া উচিত [...] নতুন উপাদান নাম তৈরি করা উচিত নয়।

তবে এই নির্দেশাবলী মূলত ব্রাউজার বিক্রেতাদেরই নির্দেশিত, যারা ধারণা করেছেন যে তারা যে কাস্টম উপাদান তৈরি করতে বেছে নিয়েছে তার জন্য ভিজ্যুয়াল স্টাইলিং এবং কার্যকারিতা সরবরাহ করবে।

কোনও লেখকের পক্ষে, যদিও পৃষ্ঠাতে কোনও কাস্টম উপাদান এম্বেড করা আইনী হতে পারে (কমপক্ষে এক্সএমএল সিরিয়ালাইজেশনে), আপনি ডিওমে কোনও নোড ছাড়া আর কিছু পাচ্ছেন না। আপনি যদি নিজের কাস্টম উপাদানটি আসলে কিছু করতে চান বা কোনও বিশেষ উপায়ে উপস্থাপন করতে চান তবে আপনার কাস্টম উপাদানগুলির স্পেসিফিকেশনটির দিকে নজর দেওয়া উচিত ।

বিষয়টিতে আরও মৃদু প্রাইমারের জন্য, ওয়েব উপাদানগুলির ভূমিকা পড়ুন , যার মধ্যে শ্যাডো ডিওএম এবং অন্যান্য সম্পর্কিত স্পেসিফিকেশন সম্পর্কিত তথ্যও রয়েছে। এই স্পেসগুলি এখনও এই মুহুর্তে খসড়াগুলি নিয়ে কাজ করছে - আপনি এখানে বর্তমান অবস্থা দেখতে পারেন - তবে সেগুলি সক্রিয়ভাবে বিকাশ করা হচ্ছে।

উদাহরণস্বরূপ, কোনও greetingউপাদানের জন্য একটি সাধারণ সংজ্ঞা দেখতে এর মতো দেখতে পারে:

<element name="greeting">
  <template>
    <style scoped>
      span { color:gray; }
    </style>
    <span>Simon says:</span>
    <q><content/></q>
  </template>
</element>

এটি ব্রাউজারকে উদ্ধৃতিগুলিতে উপাদান সামগ্রী রেন্ডার করতে এবং "সাইমন বলেছেন:" রঙের ধূসর দিয়ে স্টাইলযুক্ত পাঠ্য দ্বারা উপস্থাপিত করতে বলে। সাধারণত এর মতো একটি কাস্টম উপাদান সংজ্ঞাটি কোনও পৃথক এইচটিএমএল ফাইলে সংরক্ষণ করা হবে যা আপনি কোনও লিঙ্কের মাধ্যমে আমদানি করবেন।

<link rel="import" href="greeting-definition.html" />

যদিও আপনি চাইলে এটি ইনলাইন অন্তর্ভুক্ত করতে পারেন।

পলিমার পলিফিল লাইব্রেরি ব্যবহার করে উপরের সংজ্ঞাটির একটি কার্যনির্বাহী প্রতিবেদন তৈরি করেছি যা আপনি এখানে দেখতে পারেন । নোট করুন যে এটি পলিমার লাইব্রেরির একটি পুরানো সংস্করণ ব্যবহার করছে - আরও সাম্প্রতিক সংস্করণগুলি বেশ আলাদাভাবে কাজ করে। যাইহোক, অনুমান এখনও বিকাশের সাথে, এটি যাইহোক প্রডাকশন কোডটি ব্যবহার করার পরামর্শ দেব।

— জেমস হোল্ডারেন্স
সূত্র
2

কোনও ডোম ডিক্লেশন ছাড়াই আপনি যা চান তা ব্যবহার করুন

<container>content here</container>

আপনার নিজস্ব স্টাইল যুক্ত করুন (প্রদর্শন: ব্লক) এবং এটি যে কোনও আধুনিক ব্রাউজারের সাথে কাজ করবে

— এরিক বোলেউ
সূত্র
1

data-*বৈশিষ্ট্যগুলি HTML5 এবং এমনকি HTML4 তে সমস্ত ওয়েব ব্রাউজারগুলিতে তাদের শ্রদ্ধার জন্য ব্যবহৃত হয়। নতুন ট্যাগ যুক্ত করা প্রযুক্তিগতভাবে ঠিক আছে তবে এটি সুপারিশ করা হয়নি কারণ:

  1. এটি ভবিষ্যতে যুক্ত হওয়া কোনও কিছুর সাথে সাংঘর্ষিক হতে পারে এবং
  2. এইচটিএমএল ডকুমেন্টটিকে জাভাস্ক্রিপ্টের মাধ্যমে গতিশীলভাবে যুক্ত না করা অবৈধ করে তোলে।

আমি শুধুমাত্র স্থানে কাস্টম ট্যাগ ব্যবহার যে Google গ্রাহ্য না করে, কোনো গেম ইঞ্জিন iframe এ ecample জন্য, আমি একটি তৈরি <log>ট্যাগ যা অন্তর্ভুক্ত <msg>, <error>এবং <warning>- কিন্তু মাধ্যমে জাভাস্ক্রিপ্ট শুধুমাত্র। এবং এটি সম্পূর্ণরূপে বৈধ ছিল, যাচাইকারী অনুসারে। এমনকি এটি তার স্টাইলিংয়ের সাথে ইন্টারনেট এক্সপ্লোরারেও কাজ করে! ;]

— Петров Петров
সূত্র
1
এটি বৈধকারীর কাছে বৈধ ছিল কারণ আপনি জাভাস্ক্রিপ্টের সাহায্যে এই উপাদানগুলি তৈরি করছেন এবং যাচাইকারী তাদের দেখতে পান নি কারণ এটি আপনার জাভাস্ক্রিপ্ট চালায় না। এটি প্রথম পৃষ্ঠাটি লোড করার সময় পৃষ্ঠাটি কেবল প্রদর্শিত হবে।
— animuson
যথাযথভাবে। বৈধ এইচটিএমএল না থাকাকালীন কাস্টম ট্যাগগুলি এখনও বৈধ এসজিএমএল এবং এইচটিএমএল সর্বোপরি এসজিএমএল। সিএসএস কাস্টম ট্যাগ স্টাইল করতে ব্যবহার করা যেতে পারে এবং এটি আইইতে নিখুঁতভাবে কাজ করে। :) এছাড়াও, আপনি আপনার ডক্টইপিই স্পেসিফিকেশনে আপনার নিজস্ব কাস্টম উপাদানগুলির সাথে আপনার নিজের ডিটিডি নির্দিষ্ট করতে পারেন, সুতরাং আমার কাস্টম ট্যাগগুলি জাভাস্ক্রিপ্ট ছাড়াই বাস্তবে বৈধতা পেতে পারে - তবে আমি সেগুলির যত্ন করি না - একটি গেম ইঞ্জিন জিইউআই সিস্টেম অবশ্যই গুগল নয় কাজ :)
— Петров
1
ভাল, একটি ধরা আছে। আপনি কেবল কাস্টম উপাদানগুলি উইলি নিলিতে ফেলতে পারবেন না। তাদের "বৈধ" এইচটিএমএল বিবেচনা করার জন্য আপনাকে ডিটিডি দিয়ে তাদের সংজ্ঞায়িত করতে হবে এবং নিবন্ধভুক্ত করতে হবে। কিছু কাজ করে বলে এর অর্থ বৈধ নয়।
— অ্যানিমুসন
আপনি যদি কেবলমাত্র আপনার উপাদানগুলির নামেরগুলিতে <x-msg>, <x-log>, ইত্যাদির জন্য কোনও যোগ্যতা যুক্ত করেন তবে আপনি ওয়েব উপাদান / কাস্টম উপাদানসমূহের অনুমানের সাথে সম্মতি দিচ্ছেন।
— নীল মনরো
একটি গেম ইঞ্জিনে যেখানে ওয়েবকিট কেবল আপনার গতিশীল জিইআইআই রেন্ডার করার জন্য রয়েছে, সেখানে কেউ ডিটিডিও যত্ন নেবে না। HTML- এর জন্য কোনো অজানা ট্যাগ হল HTMLUnknownElement জাতীয় জন্য, এখনও, jQuery এবং CSS দিয়ে পুরোপুরি কাজ তাই আপনার গুই শেষে কিছু শব্দার্থবিদ্যা পায়: <inventory>, <item type="potion" sprite="2">- তাই এটা ভাল বরং এইচটিএমএল চেয়ে যার SGML + + সিএসএস বলা হবে, যে HTML উপাদানগুলি সংজ্ঞা আছে সত্ত্বেও যেমনটি কাজ করুন - বোতামগুলি, তালিকা, ...
— Петър Петров
1

কাস্টম ট্যাগগুলি HTML5 তে বৈধ নয়। তবে বর্তমানে ব্রাউজারগুলি সেগুলি পার্স করতে সহায়তা করছে এবং আপনি সেগুলি CSS ব্যবহার করেও ব্যবহার করতে পারেন। সুতরাং আপনি যদি বর্তমান ব্রাউজারগুলির জন্য কাস্টম ট্যাগ ব্যবহার করতে চান তবে আপনি পারেন। ব্রাউজারগুলি এইচটিএমএল বিষয়বস্তু বিশ্লেষণের জন্য ডাব্লু 3 সি মানক কঠোরভাবে প্রয়োগ করার পরে সমর্থনটি সরিয়ে নেওয়া যেতে পারে।

— নিসারগ শাহ
সূত্র
1
তারা যখন সমর্থন করা বন্ধ করে দেবে <center>এবং তখনই তা ঘটবে <marquee>?
— রাভেনস্টাইন
1

আমি জানি এই প্রশ্নটি পুরানো, তবে আমি এই বিষয়টি অধ্যয়ন করছি এবং উপরোক্ত কিছু বিবৃতি সঠিক হলেও, এটি কাস্টম উপাদান তৈরি করার একমাত্র উপায় নয়। উদাহরণ স্বরূপ:

<button id="find">click me</button>
<Query? ?attach="find" ?content="alert( find() );" ?prov="Hello there :D" >
I won't be displayed :D
</Query?>

<style type="text/css">

[\?content] {

display: none;

}

</style>

<script type="text/javascript">

S = document.getElementsByTagName("Query?")[0];

Q = S.getAttribute("?content");

A = document.getElementById( S.getAttribute("?attach") );

function find() {

  return S.getAttribute("?prov");

}

(function() {

A.setAttribute("onclick", Q);

})();

</script>

পুরোপুরি সূক্ষ্মভাবে কাজ করবে (Google Chrome, IE, ফায়ারফক্স এবং মোবাইল সাফারি এর নতুন সংস্করণগুলিতে)। ট্যাগটি শুরু করার জন্য আপনার কেবলমাত্র একটি আলফা অক্ষর (এজেড, এজেড) প্রয়োজন, এবং তারপরে আপনি নন আলফা অক্ষরের কোনওটি ব্যবহার করতে পারেন। যদি সিএসএসে থাকে তবে অবশ্যই উপাদানটি অনুসন্ধানের জন্য আপনাকে অবশ্যই "\" (ব্যাকস্ল্যাশ) ব্যবহার করতে হবে, যেমন কোয়েরি দরকার হবে \ ^ {...}} তবে জেএসে, আপনি কেবল এটি কীভাবে দেখেন তা কল করে। আমি আশা করি এটি সাহায্য করবে। এখানে উদাহরণ দেখুন

-মিন্ক সিবিওএস

— এফেলন ড্যান্টজলার
সূত্র
3
এটি ইদানীং দেখে আসা সবচেয়ে অদ্ভুত এইচটিএমএল :)
— ড্যান ড্যাসাকলেসকু
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.