জাভাস্ক্রিপ্ট সহ <html> এ ক্লাস যুক্ত করবেন?

88

<html>জাভাস্ক্রিপ্ট ব্যবহার করে আপনি কীভাবে মূল উপাদানটিতে একটি শ্রেণি যুক্ত করবেন ?

javascript html

আমি যখন জিজ্ঞাসা করি তখন এটি আমি জিজ্ঞাসা করেছি। আমি উল্লেখ করেছিলাম এমন কোনও ভাল জায়গা আমি কখনই পাইনি। আমি এখানে এটি দেখে খুশি।

— Pow-Ian

শুধু কৌতূহলী - আপনি এটি করতে চান কেন?

— ডেভিড হোয়ারস্টার

@ ডেভিড মডার্নিজার লোড না হলে ফ্যালব্যাক যুক্ত করতে To মডার্নিজার "js" শ্রেণিটি যুক্ত করে যখন এটি লোড হয়।

— ব্র্যান্ডন লেবেদেভ

4

আপনি যদি আধুনিকীকরণ ব্যবহার করে থাকেন তবে আপনার মার্কআপটিতে "নো-জেএস" শ্রেণিটি সত্যই যুক্ত করা উচিত। (মডার্নিজার যদি বোঝায় এটি এই শ্রেণিটি সরিয়ে ফেলবে)

— কেভিন বাউচার

@ কেভিন - ইতিমধ্যে করেছেন। যান HTML5 এর boilerplate !

— ব্র্যান্ডন লেবেদেভ

113

এটার মত:

var root = document.getElementsByTagName( 'html' )[0]; // '0' to assign the first (and only `HTML` tag)

root.setAttribute( 'class', 'myCssClass' );

অথবা পূর্বে প্রয়োগ হওয়া ক্লাসগুলি সংরক্ষণ করতে এটি আপনার 'সেটার' লাইন হিসাবে ব্যবহার করুন: (ধন্যবাদ @ আমা 2)

root.className += ' myCssClass';

বা, প্রয়োজনীয় ব্রাউজার সহায়তার উপর নির্ভর করে আপনি এই classList.add()পদ্ধতিটি ব্যবহার করতে পারেন :

root.classList.add('myCssClass');

https://developer.mozilla.org/en-US/docs/Web/API/Element/classList http://caniuse.com/#feat=classlist

হালনাগাদ:

HTMLউপাদানটি উল্লেখ করার জন্য আরও মার্জিত সমাধান এটি হতে পারে:

var root = document.documentElement;
root.className += ' myCssClass';
// ... or:
//  root.classList.add('myCssClass');
//

— কেভিন বাউচার
সূত্র

এফওয়াইআই, ক্লাসলিস্ট.অ্যাড / .রেভ ডকুমেন্ট.ডোকামেন্টএলমেন্টে কাজ করে না।

— অ্যান্ডি মার্সার

@ অ্যান্ডিমার্সার এটি classList.add(উটের ক্ষেত্রে)।

— কেভিন বাউচার

হ্যাঁ স্পষ্টতই এটি একটি টাইপ ছিল। তবে আমি যা বলেছি তা এখনও সঠিক। classListডকুমেন্ট.ডোকমেটলেমেন্টে কাজ করে না।

— অ্যান্ডি মার্সার

জবাব দেওয়ার আগে আমি এটি তিনটি পৃথক ব্রাউজারে চেষ্টা করেছি, সুতরাং এটি "স্পষ্টতই একটি টাইপো" ছিল না। (ক্রোম, ফায়ারফক্স, সাফারি - এই তিনটিতেই root.classList.add('myCssClass')কাজ করেছেন)) আপনি আইই ব্যবহার করছেন?

— কেভিন বাউচার

document.documentElement.classList.addএখানে ঠিকঠাক কাজ মনে হচ্ছে। 2018 এর ব্রাউজারগুলি কি এটি সমর্থন করা শুরু করেছে?

— অ্যাড্রিয়ান

15

এটিও কাজ করা উচিত:

document.documentElement.className = 'myClass';

সামঞ্জস্যতা ।

সম্পাদনা করুন:

আইই 10 এটি কেবল পঠনযোগ্য হিসাবে গণনা করে; এখনো:

এটা কাজ করেছে!?

অপেরা কাজ করে:

কাজ

এটি এতে কাজ করে তাও আমি নিশ্চিত করতে পারি:

ক্রোম 26
ফায়ারফক্স 19.02
সাফারি 5.1.7

— সি 24 ডাব্লু
সূত্র

আপনার উদাহরণটিতে U+200Bচূড়ান্ত অক্ষর রয়েছে, যথা চূড়ান্ত অ্যাস্ট্রোফির পরে, এটি ওয়েবপ্যাক এবং অন্যান্য সংকলকগুলিতে সংকলন ব্যর্থ করে দেয়!

— এন্টোজুন

@ এন্টোজুন কত অদ্ভুত! যে ইশারা জন্য ধন্যবাদ। আমি এখনই এটি ঠিক করে

— রেখেছি

11

আমি আপনাকে jQuery এ একবার দেখার পরামর্শ দিচ্ছি ।

jQuery উপায়:

$("html").addClass("myClass");

— aebersold
সূত্র

26

জাভাস্ক্রিপ্ট সহ কোনও উপাদান নির্বাচন করতে আপনার jQuery দরকার নেই।

— ডেভিড হোয়েস্টার

4

jQuery শেখা সহজতর, এবং এই দিনগুলিতে বেশিরভাগ সময় ব্যবহৃত হয়। তবে হ্যাঁ, এই কাজের জন্য আপনার এটির দরকার নেই;)

— এবারসোল্ড

4

হ্যাঁ, ঠিক আছে, আমরা জানি জেকোরি কী, তবে "শিখুন জ্যাকুয়ারি" দিয়ে খাঁটি জাভাস্ক্রিপ্ট প্রশ্নের উত্তর দেওয়া আমাকে অবাক করে দিয়েছে :)

— পোভিলাস্প

4

@ অয়েবারসোল্ড আমি সম্মত হই যে jQuery শিখতে এবং ব্যবহার করা সহজ, তবে ৫০ কে এ ডাউনলোড করতে (অতিরিক্ত অতিরিক্ত অনুরোধ) কেবল একটি শ্রেণি যুক্ত করার জন্য, এটি ওভারকিল আইএমএইচও এর কিছুটা অংশ।

— ডেভিড হোয়ারস্টার

জিকুয়েরিতে মৃত্যু! জয়ের জন্য ভ্যানিলা জেএস!

— ফ্রেশেবুল

9

document.documentElement.classList.add('myCssClass');

classListIE10: https://caniuse.com/#search=classlist থেকে সমর্থিত

— টম এস্তেরেজ
সূত্র

7

আপনার ক্লাস যুক্ত করা উচিত এটি ওভাররাইট না করে

var headCSS = document.getElementsByTagName("html")[0].getAttribute("class") || "";
document.getElementsByTagName("html")[0].setAttribute("class",headCSS +"foo");

ব্রাউজারের অসুবিধাগুলি এড়াতে আমি এখনও jQuery ব্যবহার করার পরামর্শ দেব

— ama2
সূত্র

-2

জ্যাকুরির সাথে ... আপনি এইচটিএমএল উপাদানগুলিতে ক্লাস যুক্ত করতে পারেন:

$(".divclass").find("p,h1,h2,h3,figure,span,a").addClass('nameclassorid');

নেমক্লোরসিড বিন্দু বা শুরুতে # নয়

— রুস বাউটিস্তা
সূত্র