'ইনারটেক্সট' আইই তে কাজ করে তবে ফায়ারফক্সে নয়

Question

আমার কাছে কিছু জাভাস্ক্রিপ্ট কোড রয়েছে যা নীচে থাকা আইই তে কাজ করে:

myElement.innerText = "foo";

তবে, মনে হচ্ছে ফায়ারফক্সে 'ইনারটেক্সট' সম্পত্তি কাজ করে না। কিছু ফায়ারফক্স সমতুল্য আছে? বা আরও সাধারণ, ক্রস ব্রাউজার সম্পত্তি ব্যবহার করা যেতে পারে?

Comments

এটি করা উচিত myElement.innerHTML = "foo";

— স্টিফিটা

এটি সরবরাহকৃত মান দিয়ে বস্তুর মধ্যে সমস্ত এইচটিএমএলকে প্রতিস্থাপন করবে।

— ওএমজি পনিস

এখান থেকেই jQuery এর মতো লাইব্রেরিগুলি আপনাকে একটি স্ট্যান্ডার্ড ফ্রেমওয়ার্ক ব্যবহার করে সক্ষম করে ক্রস-ব্রাউজারের অসঙ্গতিগুলির যত্ন নেওয়ার সাথে সাথে জীবন আরও সহজ করে তোলে।

— ড্যান ডিপ্লো

তবে এখনও যত্ন নেওয়ার জন্য এইচটিএমএল না থাকলে উপযুক্ত হতে পারে।

— অ্যালেক্স পোলো

সুতরাং কীভাবে এটি সম্ভব (যা গঠনমূলক নয়) এর পরিবর্তে এই ক্রস ব্রাউজার বিকল্পটি কীভাবে ব্যবহার করবেন তা আমাদের বলুন।

— সাসকিউ

Answer 1

ফায়ারফক্স ডাব্লু 3 সি-অনুবর্তী টেক্সট কনটেন্ট সম্পত্তি ব্যবহার করে ।

আমার ধারণা সাফারি এবং অপেরাও এই সম্পত্তিটিকে সমর্থন করবে।

Comments

innerText/ 2016. হিসাবে মুক্তিযোদ্ধা সমর্থিত থাকবে

— বব

@ Bob 22 ফেব্রুয়ারী, ২০১ 2016 এ এখনও নেই।

— ক্রিলগার

@ ক্রিলগার এটি ফায়ারফক্স 45-এ নির্ধারিত হয়েছে, এটি 8 ই মার্চের সপ্তাহে প্রকাশিত হবে। এটি ইতিমধ্যে বর্তমান বিটা রিলিজে রয়েছে এবং কিছুক্ষণের জন্য অরোরার মধ্যে রয়েছে। এর ব্যবহারিকভাবে যা বোঝায় তা হ'ল আপনি innerTextকেবলমাত্র ব্যবহার করে সাইটগুলি বিকাশ করা শুরু করতে পারেন এবং অদূর ভবিষ্যতে সমস্ত বর্তমান ব্রাউজারগুলিতে এবং পুরানো-আইআইও এটি কাজ করার আশা করতে পারেন।

— বব

FTR: innerTextহয় গভীর বিভিন্ন থেকে textContent, এবং আসলে খুব দরকারী (আশ্চর্যজনক একটি সম্ভাব্য ইন্টারনেট ছল ... থেকে) হল: innerTextচেষ্টা কিভাবে লেখা একটি সন্নিকর্ষ দিতে আসলে উপস্থাপন সম্পূর্ণভাবে মতো ব্রাউজারে textContent, যা প্রায় আয় tag- স্ট্রিপড মার্কআপ উত্স , অল্প মূল্য যুক্ত করা বা অতিরিক্ত সমস্যা (শব্দ সীমা হ্রাসের মতো)

— জেড

ইনারটেক্সটটি এখনও 2019 এ 64 সংস্করণে সমর্থন করে না

— টনি ডং

Answer 2

আপডেট : আমি একটি ব্লগ পোস্ট লিখেছিলাম যা সমস্ত পার্থক্যকে আরও ভালভাবে বর্ণনা করে।

---

ফায়ারফক্স Node::textContentডাব্লু 3 সি স্ট্যান্ডার্ড ব্যবহার করে , তবে এর আচরণ এমএসএইচটিএমএল এর মালিকানাধীন innerText(অপেরা দ্বারাও অনুলিপি করা হয়েছে, কিছুকাল আগে, কয়েক হাজার এমএসএইচটিএমএল বৈশিষ্ট্যগুলির মধ্যে) থেকে আলাদা হয়েছিল।

প্রথমত, textContentসাদা স্থানের প্রতিনিধিত্ব innerTextএকের থেকে আলাদা । দ্বিতীয়ত এবং আরও গুরুত্বপূর্ণভাবে, textContent সমস্ত স্ক্রিপ্ট ট্যাগ সামগ্রী অন্তর্ভুক্ত করে , যদিও ইনারটেক্সটটি এটি করে না।

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

textContentNodeইন্টারফেসের অংশ , যেখানে innerTextঅংশ HTMLElement। এটির উদাহরণস্বরূপ, এর অর্থ হ'ল আপনি "পুনরুদ্ধার" করতে পারেন textContentতবে innerTextপাঠ্য নোড থেকে নয় :

var el = document.createElement('p');
var textNode = document.createTextNode('x');

el.textContent; // ""
el.innerText; // ""

textNode.textContent; // "x"
textNode.innerText; // undefined

অবশেষে, সাফারি ২. এক্স এর বগি প্রয়োগও রয়েছে innerText। সাফারিতে innerTextকেবল সঠিকভাবে কাজ করে যদি কোনও উপাদান style.display == "none"দস্তাবেজ থেকে না লুকানো থাকে (না হয় ) বা অনাথ হয়। অন্যথায়, innerTextখালি স্ট্রিংয়ের ফলাফল।

আমি textContentবিমূর্ততা নিয়ে খেলছিলাম (এই ঘাটতিগুলি পূরণ করার জন্য), তবে এটি জটিল থেকে প্রমাণিত হয়েছিল ।

আপনার সেরা বাজি হ'ল প্রথমে আপনার সঠিক প্রয়োজনীয়তাগুলি সংজ্ঞায়িত করা এবং সেখান থেকে অনুসরণ করা follow innerHTMLসম্ভাব্য textContent/ innerTextবিচ্যুতির সমস্ত বিষয়ে ডিলের পরিবর্তে প্রায়শই কোনও উপাদান থেকে ট্যাগগুলি সরিয়ে ফেলা সম্ভব ।

অবশ্যই আরেকটি সম্ভাবনা হ'ল ডিওএম ট্রিটি হাঁটা এবং পুনরাবৃত্তভাবে পাঠ্য নোডগুলি সংগ্রহ করা।

Comments

ক্রোমও ইন্টার্নটেক্সটকে সমর্থন করে, সুতরাং মনে হয় ফায়ারফক্স একমাত্র প্রধান ব্রাউজার যা এটি সমর্থন করে না। এবং IE হ'ল একমাত্র ব্রাউজার যা টেক্সট কনটেন্টকে সমর্থন করে না।

— মাইক নেলসন

@ মাইক - তবে মনে হচ্ছে এটি innerTextChrome এ ব্যবহার করা 60 গতি কম । jsperf.com/text-content/3

— gblazex

textContentএখন IE9 + তে সমর্থিত, তবে ফায়ারফক্স এখনও সমর্থন করে না innerText(যদিও তারা outerHTMLকিছুদিন আগে আইই-প্রবর্তন করেছিল )।

— কঙ্গাক্স

যারা এখনও IE8 সমর্থন করার জন্য প্রয়োজন, সেখানে একটি প্রশংসনীয় সম্পূর্ণ এর Node.textContent: উন্নতি এখানে shim github.com/usmonster/aight/blob/node-textcontent-shim/js/... (আশা শীঘ্রই অন্তর্ভুক্ত করা aight )।

— ন্যো

innerText২০১ / সালের হিসাবে এফএফ-তে সমর্থন করা হবে

— বব

Answer 3

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

function setTextContent(element, text) {
    while (element.firstChild!==null)
        element.removeChild(element.firstChild); // remove all existing content
    element.appendChild(document.createTextNode(text));
}

Comments

জাভাস্ক্রিপ্টে "! ==" অপারেটর না থাকলে আমি মনে করি যে দ্বিতীয় লাইনের অপারেটরটি কেবল "! =" হওয়া উচিত।

— রেক্স করুন

@ রেক্স: জাভাস্ক্রিপ্টের একটি !==অপারেটর রয়েছে, বিপরীত ===। ===/ দ্বারা ব্যবহৃত টাইপ-সংবেদনশীল তুলনা !==সাধারণত আলগা তুলনাকারীদের ==/ এর চেয়ে ভাল !=।

— ববিনস

ইন্টারনেট এক্সপ্লোরার এ স্ক্রিপ্ট ট্যাগগুলির পাঠ্য সেট করতে কাজ করে না (আমি এগুলি একটি টেম্পলেট জন্য ব্যবহার করছিলাম)। আপনি `স্ক্রিপ্টট্যাগমেন্টমেন্ট.টেক্সট = 'আমার টেম্পলেট {{এখানে}}' সেট করেছেন;

— ক্রিস্টোফার তারকুইনি

আপনি কেন লুপটি ব্যবহার করেছেন (এবং আমি সম্পূর্ণরূপে পুরোপুরি ফেলে দেব) তা বুঝতে খুব কঠিন চিন্তা করতে !==nullহয়েছিল কেবলমাত্র লুপটি প্রতিস্থাপনের পরিবর্তে element.innerHTML=''(যা লুপ হিসাবে ঠিক একই কাজটি করার জন্য অনুমিত হয় এবং তারপরে আমার মনে পড়ে ... ।: টেবিলগুলি (লিগ্যাসি-) আইই ... ericvasilik.com/2006/07/code-karma.html আমি সম্ভবত "লুকানো" এর একটি সংক্ষিপ্ত বিবরণ যোগ করার পরামর্শ দিচ্ছি এবং প্রায়শই কখনই অ্যাম্প এলটিcreateTextNode প্রতিস্থাপনের 'পার্শ্ব-প্রতিক্রিয়া' নথিভুক্ত করা যায় না এবং তাদের নিজ নিজ এইচটিএমএল চরিত্রের সত্তাগুলির জন্য

— জিটি

Answer 4

jQuery একটি .text()পদ্ধতি সরবরাহ করে যা যে কোনও ব্রাউজারে ব্যবহার করা যেতে পারে। উদাহরণ স্বরূপ:

$('#myElement').text("Foo");

Answer 5

প্রকাশ কে এর উত্তর অনুসারে ফায়ারফক্স ইনারটেক্সট সম্পত্তি সমর্থন করে না। সুতরাং আপনি সহজেই পরীক্ষা করতে পারেন যে ব্যবহারকারী এজেন্ট এই সম্পত্তিটিকে সমর্থন করে কিনা এবং নীচের মত অনুসারে এগিয়ে যেতে পারেন:

function changeText(elem, changeVal) {
    if (typeof elem.textContent !== "undefined") {
        elem.textContent = changeVal;
    } else {
        elem.innerText = changeVal;
    }
}

Comments

ইলেমে 'টেক্সট কনটেন্ট' সহজ হবে

— জেমি প্যাট

যদি (elem.textContent! = নাল) খুব সহজ হত!

— এলমু

Answer 6

জাভাস্ক্রিপ্টের সত্যিকারের সরল রেখাটি সমস্ত প্রধান ব্রাউজারগুলিতে "নন-ট্যাগি" পাঠ্য পেতে পারে ...

var myElement = document.getElementById('anyElementId');
var myText = (myElement.innerText || myElement.textContent);

Comments

এটির সাথে একটি সমস্যা রয়েছে (কমপক্ষে আইই 8 তে): যদি ইনারটেক্সটটি খালি স্ট্রিং হয় এবং টেক্সট কনটেন্টটি অপরিজ্ঞাত হয় তবে (myElement.innerText || myElement.textContent) অপরিজ্ঞাত হয়ে যায়।

— ম্যাগনাস

ভাল বাগ @Magnus দ্বারা হিসাবে উল্লিখিত হিসাবে, এটি সত্য আছে সচেতন হচ্ছে এর মূল্য কিভাবে বিভিন্নতর textContentএবং innerTextরিপোর্ট হোয়াইটস্পেস যে কিছু ব্যবহারের ক্ষেত্রে জন্য কোন ব্যাপার হতে পারে।

— মার্ক অ্যামেরি

কেবল অপরটি সংযুক্ত করুন ||, অর্থ: var myText = (myElement.innerText || myElement.textContent || "") ;অনির্ধারিত মানকে অতিক্রম করতে।

— পিটারএম 16

Answer 7

নোট করুন যে Element::innerTextসম্পত্তিটিতে এমন পাঠ্য থাকবে না যা display:noneগুগল ক্রোমে সিএসএস স্টাইল " " দ্বারা গোপন করা হয়েছে (পাশাপাশি এটি অন্য সিএসএস টেকনিকগুলির দ্বারা মুখোশযুক্ত কন্টেন্টকে ফেলে দেবে (ফন্টের আকার: 0, রঙ: স্বচ্ছ, এবং কিছু অন্যান্য অনুরূপ প্রভাব যার ফলে পাঠ্যটি কোনও দৃশ্যমান উপায়ে রেন্ডার না করা)।

অন্যান্য সিএসএসের বৈশিষ্ট্যগুলিও বিবেচনা করা হয়:

• প্রথমে অভ্যন্তরীণ উপাদানগুলির "প্রদর্শন:" স্টাইলটি পার্স করে এটি নির্ধারণ করা হয় যে এটি কোনও ব্লক বিষয়বস্তু সীমিত করে (যেমন "প্রদর্শন: ব্লক" যা ব্রাউজারের অন্তর্নির্মিত স্টাইলশীটে এইচটিএমএল ব্লক উপাদানগুলির ডিফল্ট, এবং যার আচরণের দ্বারা ওভার্রাইড হয় নি আপনার নিজস্ব সিএসএস শৈলী); যদি তাই হয় তবে একটি নতুনলাইন অন্তর্নির্ভর সম্পত্তিটির মানতে .োকানো হবে। এটি টেক্সট কনটেন্ট সম্পত্তি দ্বারা ঘটবে না।
• সিএনএস বৈশিষ্ট্য যা ইনলাইন সামগ্রীগুলি উত্পন্ন করে তাও বিবেচনা করা হবে: উদাহরণস্বরূপ ইনলাইন উপাদান <br \> যা একটি ইনলাইন নিউলাইন উত্পন্ন করে তাও ইনটারটেক্সটের মানটিতে একটি নতুন লাইন তৈরি করবে।
• "ডিসপ্লে: ইনলাইন" স্টাইলটি টেক্সট কনটেন্ট বা ইনটারটেক্সটে কোনও নতুন লাইন তৈরি করে না।
• "প্রদর্শন: টেবিল" স্টাইলটি টেবিলের চারপাশে এবং সারণির সারিগুলির মধ্যে নতুন লাইন তৈরি করে তবে "প্রদর্শন: টেবিল-ঘর" একটি সারণী অক্ষর তৈরি করে।
• "অবস্থান: পরম" সম্পত্তি (প্রদর্শনের সাথে ব্যবহৃত: ব্লক বা প্রদর্শন: ইনলাইন, এটি কোনও বিষয় নয়) এছাড়াও একটি লাইন বিরতি সন্নিবেশ করিয়ে দেবে।
• কিছু ব্রাউজার স্প্যানের মধ্যে একটি একক স্পেস বিভাজনও অন্তর্ভুক্ত করে

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

মাউস নির্বাচন ব্যবহার করে একটি অনুলিপি / আটকানো ক্রিয়াকলাপটি ক্লিপবোর্ডে রাখা সরল-পাঠ্য বিন্যাসে লুকানো পাঠ্যটিকে বাতিল করে দেবে, সুতরাং এতে সমস্ত কিছুই থাকবে না textContentতবে কেবল যা আছে তা ভিতরে থাকবে innerText(উপরের মতো সাদা স্থান / নিউলাইন প্রজন্মের পরে) ।

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

jQuery একটি $ () ক্যোয়ারির মাধ্যমে ফেরত পার্স করা উপাদানগুলিতে যুক্ত হওয়া ".text ()" পদ্ধতি ব্যবহার করে ব্রাউজারগুলির মধ্যে এই অসঙ্গতিগুলি সমাধান করবে। অভ্যন্তরীণভাবে, এটি কেবলমাত্র "নোড" স্তর নিয়ে কাজ করে এইচটিএমএল ডিওএম অনুসন্ধান করে সমস্যার সমাধান করে। সুতরাং এটি স্ট্যান্ডার্ড টেক্সট কনটেন্টের মতো আরও কিছু দেখাচ্ছে return

সতর্কবাণীটি হ'ল এই jQuery পদ্ধতিটি এমন কোনও অতিরিক্ত স্পেস বা লাইন ব্রেকগুলি সন্নিবেশ করবে না <br />যা সামগ্রীটির সাবলিলিমে (লাইক ) কারণে পর্দায় দৃশ্যমান হতে পারে ।

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

সিএসএস ট্রিকস দ্বারা লুকানো পাঠ্যগুলি এখন সাধারণত প্রধান অনুসন্ধান ইঞ্জিনগুলি দ্বারা উপেক্ষা করা হয় (এটি আপনার HTML পৃষ্ঠাগুলির সিএসএসকেও বিশ্লেষণ করবে এবং পটভূমিতে রঙের বিপরীতে নয় এমন পাঠ্যগুলিও উপেক্ষা করবে) এইচটিএমএল / সিএসএস পার্সার এবং ডিওএম সম্পত্তি ব্যবহার করে আধুনিক ভিজ্যুয়াল ব্রাউজারগুলির মতো হ'ল "ইনটারটেক্সট" (কমপক্ষে এই অদৃশ্য বিষয়বস্তু সূচীকরণ করা হবে না তাই গোপন পাঠ্যকে পৃষ্ঠাতে কিছু কীওয়ার্ড অন্তর্ভুক্ত করার জন্য এটির বিষয়বস্তুটি পরীক্ষা করতে বাধ্য করার কৌশল হিসাবে ব্যবহার করা যাবে না); তবে এই লুকানো পাঠ্যটি ফলাফলের পৃষ্ঠায় দুর্দান্তভাবে প্রদর্শিত হবে (যদি পৃষ্ঠাটি এখনও ফলাফলগুলিতে অন্তর্ভুক্ত করার জন্য সূচক থেকে যোগ্য হয়ে থাকে), অতিরিক্ত শৈলী এবং স্ক্রিপ্টগুলি ছাঁটাইয়ের জন্য সম্পূর্ণ HTML এর পরিবর্তে "টেক্সট কনটেন্ট" বৈশিষ্ট্যটি ব্যবহার করে।

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

Comments

প্রকৃতপক্ষে "ফন্ট-আকার: 0", "রঙ: স্বচ্ছ", "অস্বচ্ছতা: 0", "পাঠ্য-ইন্ডেন্ট: -9999px", ইত্যাদি সমস্ত ক্রোম / ওয়েবকিটের অন্তর্ভুক্ত innerText। আমার পরীক্ষায় কেবল "প্রদর্শন: কিছুই নয়" এবং "দৃশ্যমানতা: লুকানো" উপেক্ষা করা হয় ignored

— কঙ্গাক্স

Answer 8

myElement.innerText = myElement.textContent = "foo";

সম্পাদনা করুন (নীচের মন্তব্যের জন্য মার্ক আমেরিকে ধন্যবাদ): আপনি যদি কেবল যুক্তিযুক্ত সন্দেহের বাইরে জানেন যে কোনও কোডই এই বৈশিষ্ট্যগুলির অস্তিত্ব যাচাইয়ের উপর নির্ভর করবে না, যেমন (উদাহরণস্বরূপ) jQuery করে does তবে আপনি যদি jQuery ব্যবহার করে থাকেন তবে আপনি সম্ভবত "পাঠ্য" ফাংশনটি ব্যবহার করবেন এবং answers ('# myElement') করুন text

Comments

-1; এটি একটি খারাপ ধারণা। JQuery এর মতো লাইব্রেরিতে কোড সহ - কোডের জন্য এটি অত্যন্ত সাধারণ which কোনটি ব্যবহার করবেন তা স্থির করার জন্য সম্পত্তি innerTextবা textContentবৈশিষ্ট্যের অস্তিত্ব পরীক্ষা করতে। উভয় স্ট্রিংয়ে সেট করে, আপনি উপাদানটির সাথে অন্য ব্যক্তির কোডটি ভুল করে ভুলটি সনাক্ত করতে পারবেন যে ব্রাউজার উভয় বৈশিষ্ট্য সমর্থন করে; ফলস্বরূপ যে কোডটি খারাপ আচরণ করা দায়বদ্ধ able

— মার্ক অ্যামেরি

জিকুয়ারি $ ('# মাইলেটমেন্ট') val ভাল () ক্রস ব্রাউজারের জন্য কাজ করে।

— টনি ডং

Answer 9

innerTextফায়ারফক্সে যুক্ত করা হয়েছে এবং এফএফ 45 রিলিজটিতে এটি পাওয়া উচিত: https://bugzilla.mozilla.org/show_bug.cgi?id=264412

একটি খসড়া বৈশিষ্ট লেখা হয়েছে এবং ভবিষ্যতে এইচটিএমএল জীবনযাত্রার মান অন্তর্ভুক্ত হবে বলে আশা করা হয়: http://rocallahan.github.io/innerText-spec/ , https://github.com/whatwg/html/issues/ 465

নোট করুন যে বর্তমানে ফায়ারফক্স, ক্রোম এবং আইই বাস্তবায়ন সমস্ত বেমানান। এগিয়ে যেতে, আমরা সম্ভবত ফায়ারফক্স, ক্রোম এবং এজ পুরানো আইটি অসম্পূর্ণ থাকা অবস্থায় একত্রিত হওয়ার আশা করতে পারি।

আরও দেখুন: https://github.com/ কিউইজি / compat / issues/5

Comments

পলিফিল পাওয়া যায় কি?

— সার্ভ-ইনক

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

— বব

এর কার্যকারিতা innerTextযা হ'ল: একটি পৃষ্ঠায় দৃশ্যমান পাঠ্য, ফায়ারফক্স> = 38 এ (একটি অ্যাডনের জন্য) কমপক্ষে, <script>ট্যাগগুলি সম্পূর্ণ বাদ দেওয়া উচিত। jQuery এর $('#body').text()আমার জন্য কাজ করে না। কিন্তু একটি workaround innerText || textContentঠিক আছে। ধন্যবাদ.

— সার্ভ-ইনক

@ ব্যবহারকারী, হ্যাঁ, যদি আপনাকে Fx 38 সমর্থন করতে হয় তবে এই উত্তরটি সত্যিই প্রযোজ্য নয়। textContentআপাতত আপনার সীমাবদ্ধতা / পার্থক্য নিয়ে বেঁচে থাকতে হবে ।

— বব

Answer 10

এই জাতীয় কিছু সম্পর্কে কি?

//$elem is the jQuery object passed along.

var $currentText = $elem.context.firstChild.data.toUpperCase();

** আমার বড় বড় করা দরকার ছিল।

Comments

কাঁকড়া সমাধান; যদি উপাদানটিতে একটি পাঠ্য নোড ছাড়া আরও কিছু থাকে তবে এটি কাজ করে না।

— মার্ক অ্যামেরি

Answer 11

ফায়ারফক্স ভি 45 থেকে 2016 এর মতো, ফায়ারফক্সে innerTextকাজ করে, এর সমর্থনটি একবার দেখুন: http://caniuse.com/#search=innerText

আপনি যদি এটি ফায়ারফক্সের পূর্ববর্তী সংস্করণগুলিতে কাজ করতে চান তবে আপনি এটি ব্যবহার করতে পারেন textContent, যা ফায়ারফক্সে আরও ভাল সমর্থন রয়েছে তবে পুরানো আই সংস্করণগুলির চেয়ে খারাপ : http://caniuse.com/#search=textContent

Answer 12

এই সঙ্গে আমার অভিজ্ঞতা হয়েছে innerText, textContent, innerHTML, এবং মান:

// elem.innerText = changeVal;  // works on ie but not on ff or ch
// elem.setAttribute("innerText", changeVal); // works on ie but not ff or ch
// elem.textContent = changeVal;  // works on ie but not ff or ch
// elem.setAttribute("textContent", changeVal);  // does not work on ie ff or ch
// elem.innerHTML = changeVal;  // ie causes error - doesn't work in ff or ch
// elem.setAttribute("innerHTML", changeVal); //ie causes error doesn't work in ff or ch
   elem.value = changeVal; // works in ie and ff -- see note 2 on ch
// elem.setAttribute("value", changeVal); // ie works; see note 1 on ff and note 2 on ch

যেমন = ইন্টারনেট এক্সপ্লোরার, এফএফ = ফায়ারফক্স, সিএইচ = গুগল ক্রোম। নোট 1: এফএফ ব্যাকস্পেসের সাথে মান মুছে ফেলা না হওয়া পর্যন্ত কাজ করে - উপরের রে ভেগা দ্বারা নোট দেখুন। নোট 2: ক্রোমে কিছুটা কাজ করে - আপডেটের পরে এটি অপরিবর্তিত থাকে তারপরে আপনি ক্লিক করে ক্লিক করে আবার মাঠে ফিরে যান এবং মানটি উপস্থিত হয়। লটের সেরাটি হল elem.value = changeVal; যা আমি উপরে মন্তব্য করে না।

Comments

এটা শুধু আমার ? বা ওপি প্রশ্নটিকে বাতিল করে উপেক্ষা করবেন? তিনি ইনারটেক্সট / টেক্সট কনটেন্টের জন্য বলেছিলেন এবং আপনি বেশিরভাগ ইনপুট সম্পর্কে কথা বলছেন।

— ডেমেন্টিক

এই উত্তরটি পড়া খুব কঠিন। অন্যদিকে, আমি নিশ্চিত নই যে বিষয়বস্তুটি পরিষ্কার করে রাখার উপযুক্ত মূল্য রয়েছে।

— মার্ক অ্যামেরি

Answer 13

কেবলমাত্র মূল পোস্টের অধীনে মন্তব্যগুলি থেকে পুনরায় পোস্ট করা। ইনারএইচটিএমএল সমস্ত ব্রাউজারে কাজ করে। ধন্যবাদ স্টিফিটা

myElement.innerHTML = "foo";

Comments

-1; আপনি যে পাঠ্যটি অর্পণ করছেন তাতে কোনও ট্যাগ বা অন্যান্য এইচটিএমএল সিনট্যাক্স নেই এমনটি আপনি নিশ্চিত না করতে পারবেন না / / এর innerHTMLজন্য পর্যাপ্ত প্রতিস্থাপন নয়। ব্যবহারকারীর সরবরাহিত যে কোনও ডেটার জন্য আপনার অবশ্যই নিশ্চয়তা নেই। এই সতর্কতা ছাড়াই এই পদ্ধতির দিকে ঠেলাঠেলি বিপজ্জনক যে এই কারণে এটি XSS সুরক্ষা গর্ত হতে পারে । অনেকগুলি নিরাপদ পদ্ধতির উপলব্ধ রয়েছে, এমনকি এটিকে বিবেচনা করার কোনও কারণ নেই। textContentinnerText

— মার্ক অ্যামেরি

চিহ্নিত করুন, আমার বোধগম্যতা হল অন্তর্নিহিত এইচটিএমএল একটি ডিভ, স্প্যান, পি এর মতো এইচটিএমএল উপাদানগুলিতে ডেটা লেখার একটি সাধারণ উপায়। আমি ফিরে আসা JSON ডেটা প্রক্রিয়া করতে এটি ব্যবহার করি। এটি

— জিকুয়েরিতেও রয়েছে

আপনি যদি কোনও JSON প্রতিক্রিয়া থেকে স্বেচ্ছাসেবী স্ট্রিং পেয়ে থাকেন এবং এটিকে কোনও উপাদানকে অর্পণ করেন তবে .innerHTMLআপনার কোডটি নষ্ট হয়ে গেছে এবং আপনি এক্সএসএসের জন্য সম্ভাব্যরূপে দুর্বল। স্ট্রিং হলে কী হয় "<script>alert(1)</script>"?

— মার্ক আমেরি

@ মার্কআমেরি: এইচটিএমএল 5 নির্দিষ্ট করে যে এর <script>মাধ্যমে aোকানো একটি ট্যাগ innerHTMLকার্যকর করা উচিত নয়। তবে এটি পুরানো ব্রাউজারগুলিকে সুরক্ষা দেয় না। এছাড়াও, HTML5 এর innerHTMLউদাহরণস্বরূপ রক্ষা করবে না "<img src='x' onerror='alert(1)'>"।

— গীতার্ল্যাব

Answer 14

এটি এখানে পাওয়া গেছে:

<!--[if lte IE 8]>
    <script type="text/javascript">
        if (Object.defineProperty && Object.getOwnPropertyDescriptor &&
            !Object.getOwnPropertyDescriptor(Element.prototype, "textContent").get)
          (function() {
            var innerText = Object.getOwnPropertyDescriptor(Element.prototype, "innerText");
            Object.defineProperty(Element.prototype, "textContent",
              { // It won't work if you just drop in innerText.get
                // and innerText.set or the whole descriptor.
                get : function() {
                  return innerText.get.call(this)
                },
                set : function(x) {
                  return innerText.set.call(this, x)
                }
              }
            );
          })();
    </script>
<![endif]-->

Comments

কিছু ব্যাখ্যা সুন্দর হবে! এছাড়াও, এখানে কিছু অদ্ভুত বিষ্ঠা আছে; যখন আইআই> = 9 স্থানীয়ভাবে সমর্থন করেনtextContent তখন কেবলমাত্র আই 8 কে লক্ষ্যমাত্রার চেয়ে আই>> = 8-তে সীমাবদ্ধ করতে শর্তাধীন মন্তব্য কেন ব্যবহার করবেন ? এটিও লক্ষণীয় যে, যেহেতু innerTextএবং textContentবিভিন্ন আচরণ রয়েছে, উপরের কোডটি বিশ্বস্ত textContentশিম নয় - এটি সম্ভাব্য গুরুত্বপূর্ণ, তবে প্রয়োজনীয়ভাবে সুস্পষ্ট নয়!

— মার্ক অ্যামেরি

ত্রুটিটি নির্দেশ করার জন্য আপনাকে ধন্যবাদ, এটি আইই <= 8

— সিমোনারমে

Answer 15

innerTextঅন্যান্য ব্রাউজারগুলিতে আচরণ অনুকরণ করাও সম্ভব :

 if (((typeof window.HTMLElement) !== "undefined") && ((typeof HTMLElement.prototype.__defineGetter__) !== "undefined")) {
     HTMLElement.prototype.__defineGetter__("innerText", function () {
         if (this.textContent) {
             return this.textContent;
         } else {
             var r = this.ownerDocument.createRange();
             r.selectNodeContents(this);
             return r.toString();
         }
     });
     HTMLElement.prototype.__defineSetter__("innerText", function (str) {
         if (this.textContent) {
             this.textContent = str;
         } else {
             this.innerHTML = str.replace(/&/g, '&amp;').replace(/>/g, '&gt;').replace(/</g, '&lt;').replace(/\n/g, "<br />\n");
         }
     });
 }

Comments

আমার মাথার উপরের অংশ থেকে সমস্যাগুলি সন্ধান করতেই, সেটারটি নষ্ট হয়ে গেছে preযেহেতু এটি নতুন লাইনগুলিকে দ্বিগুণ করবে। আমার সন্দেহ আছে এখানে আরও ভুল আছে।

— মার্ক অ্যামেরি