ইনপুট ক্ষেত্র থেকে অ্যাট্রিবিউট পড়ার সময় এইচটিএমএল-এনকোডিং হারিয়ে গেছে

Question

আমি একটি লুকানো ক্ষেত্র থেকে কোনও মান টানতে এবং এটি একটি পাঠ্যবক্সে প্রদর্শনের জন্য জাভাস্ক্রিপ্ট ব্যবহার করছি। লুকানো ক্ষেত্রে মানটি এনকোড করা হয়।

উদাহরণ স্বরূপ,

<input id='hiddenId' type='hidden' value='chalk &amp; cheese' />

ভিতরে টানা হয়

<input type='text' value='chalk &amp; cheese' />

লুকানো ক্ষেত্র থেকে মান পেতে কিছু jQuery এর মাধ্যমে (এটি এই সময়ে আমি এনকোডিংটি হারাতে চাইছি):

$('#hiddenId').attr('value')

সমস্যাটি হ'ল আমি যখন chalk & cheeseলুকানো ক্ষেত্রটি থেকে পড়ি , জাভাস্ক্রিপ্টটি এনকোডিংটি হারাবে বলে মনে হচ্ছে। আমি মানটি চাই না chalk & cheese। আমি চাই আক্ষরিক amp;ধরে রাখা হোক।

একটি জাভাস্ক্রিপ্ট লাইব্রেরি বা jQuery পদ্ধতি আছে যা কোনও স্ট্রিং এইচটিএমএল-এনকোড করবে?

Comments

আপনি যে জাভাস্ক্রিপ্টটি ব্যবহার করছেন তা কি আপনি প্রদর্শন করতে পারেন?

— সিনান তাইফোর ২১ শে

আমি লুকিয়ে থাকা ক্ষেত্র থেকে কীভাবে মূল্য পেতে পারি তা যুক্ত করেছে

— এজেএম

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

— জেমস রোপার

কোন প্রসঙ্গে chalkএবং cheeseসর্বদা এক সাথে ব্যবহৃত হয় 0_o

— d -_- b

দুটি আইটেমের তুলনা করার সময় @ d -_- বি। উদাহরণ। এগুলি চক এবং পনির মতোই আলাদা;)

— অনুরাগ

Answer 1

সম্পাদনা: এই উত্তরটি অনেক আগে পোস্ট করা হয়েছিল এবং htmlDecodeফাংশনটি একটি এক্সএসএস দুর্বলতার পরিচয় দিয়েছে। এটি অস্থায়ী উপাদানটিকে একটি থেকে এক্সএসএস সুযোগ হ্রাস divকরার পরিবর্তিত করা হয়েছে textarea। তবে আজকাল, আমি আপনাকে অন্য উত্তরগুলিতে পরামর্শ মতো DOMParser API ব্যবহার করতে উত্সাহিত করব ।

---

আমি এই ফাংশনগুলি ব্যবহার করি:

function htmlEncode(value){
  // Create a in-memory element, set its inner text (which is automatically encoded)
  // Then grab the encoded contents back out. The element never exists on the DOM.
  return $('<textarea/>').text(value).html();
}

function htmlDecode(value){
  return $('<textarea/>').html(value).text();
}

মূলত একটি টেক্সারিয়া উপাদান স্মৃতিতে তৈরি হয় তবে এটি কখনই নথিতে সংযুক্ত থাকে না।

উপর htmlEncodeফাংশন আমি সেট innerTextউপাদান, এবং এনকোড উদ্ধার innerHTML; উপর htmlDecodeফাংশন আমি সেট innerHTMLউপাদান এবং মানinnerText প্রাপ্ত করা হয়।

এখানে একটি চলমান উদাহরণ পরীক্ষা করুন ।

Comments

এটি বেশিরভাগ দৃশ্যের জন্য কাজ করে তবে এইচটিএমএলডেকোডের এই বাস্তবায়নটি কোনও অতিরিক্ত সাদা স্থানকে মুছে ফেলবে। সুতরাং "ইনপুট" এর কিছু মানগুলির জন্য, ইনপুট! = এইচটিএমএল ডিকোড (এইচটিএমএল এনকোড (ইনপুট))। কিছু পরিস্থিতিতে আমাদের জন্য এটি একটি সমস্যা ছিল। উদাহরণস্বরূপ, যদি ইনপুট = "<p> Hi t হাই \ n সেখানে থাকে </ p>", তবে একটি রাউন্ড্রিট্রিপ এনকোড / ডিকোড "<p> হাই সেখানে </ p>" পাবেন। বেশিরভাগ সময় এটি ঠিক থাকে তবে কখনও কখনও তা হয় না। :)

— পেটিস

সমাধানের জন্য ধন্যবাদ! আমি অতিরিক্ত সাদা স্পেস সমস্যাটি সমাধান করে পাঠ্য মানটিতে %% এনএল %% এর মতো নতুন লাইনগুলি প্রতিস্থাপন করে, তারপর এইচটিএমএল এনকোড করা মানটি পেতে .html () নামে ডেকে রেখেছি, তারপরে <br /> 'এর সাথে%% NL %% প্রতিস্থাপন করেছি গুলি ... বুলেট প্রুফ নয় তবে কাজ করেছে এবং আমার ব্যবহারকারীরা %% এনএল %% টাইপ করবেন না।

— বেন্নো

মজার বিষয় হ'ল সিএসএসের একটি white-spaceসম্পত্তি রয়েছে যা এটি এইচটিএমএল সামগ্রীতে ফাঁকা স্থানগুলি কীভাবে প্রক্রিয়া করা উচিত তা নির্দেশ করে। প্রিউটির প্রেজেন্সটি বোঝায় যে "এটি পূর্বরূপযুক্ত, স্থান এবং লাইন ব্রেকগুলি সংরক্ষণ করা উচিত"। এটি স্টাইল এবং সামগ্রীর বিভাজনকে ভেঙে দেয়, কারণ আপনি যদি এইচটিএমএলটিকে "সুন্দর" হিসাবে রূপান্তর করতে চেষ্টা করেন বা আপনি যদি এ জাতীয় এনকোড / ডিকোড চক্রের মাধ্যমে এটিকে ঘুরে বেড়ান, তবে স্পেস / ব্রেকের সংখ্যা কমে যায়, এবং এনকোডারটি নেই এটি করা ঠিক ছিল কিনা তা জানার উপায়, কারণ এটি white-space:pre-*;কোনও বাহ্যিক সিএসএস ফাইলের সূচক সম্পর্কে অবগত নয় !

— ট্রায়ঙ্কো

এই সমাধানটি পৃষ্ঠাটি এইচটিএমএল বা এক্সএইচটিএমএল হিসাবে লিখিত হয়েছে কিনা তার উপর নির্ভর করতে পারে, সুতরাং আমি এমন কোনও সমাধানের পক্ষে চাই যা DOM জড়িত না।

— ফিল এইচ

যদিও এর দু'বছর পরে উত্তর দেওয়া হয়েছিল, নীচে @ এন্টারেন্টপিকের কাছ থেকে প্রাপ্ত প্রতিক্রিয়া প্রতিটি উপায়ে আরও ভাল।

— চাদ

Answer 2

JQuery ট্রিকটি উদ্ধৃতি চিহ্নগুলি এনকোড করে না এবং আইইতে এটি আপনার সাদা স্থানটি ছিনিয়ে নেবে।

জ্যাঙ্গোর পালানোর টেমপ্লেটগের উপর ভিত্তি করে , যা আমি অনুমান করি যে ইতিমধ্যে ভারী ব্যবহার / পরীক্ষা করা হয়েছে, আমি এই ফাংশনটি তৈরি করেছি যা যা প্রয়োজন তা করে।

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

function htmlEscape(str) {
    return str
        .replace(/&/g, '&')
        .replace(/"/g, '"')
        .replace(/'/g, ''')
        .replace(/</g, '&lt;')
        .replace(/>/g, '&gt;');
}

// I needed the opposite function today, so adding here too:
function htmlUnescape(str){
    return str
        .replace(/&quot;/g, '"')
        .replace(/&#39;/g, "'")
        .replace(/&lt;/g, '<')
        .replace(/&gt;/g, '>')
        .replace(/&amp;/g, '&');
}

আপডেট 2013-06-17:
দ্রুততম পালানোর সন্ধানে আমি একটি replaceAllপদ্ধতির এই বাস্তবায়নটি পেয়েছি :
http://dumpsite.com/forum/index.php?topic=4.msg29#msg29
(এছাড়াও এখানে উল্লেখ করা হয়েছে: দ্রুততম একটি স্ট্রিংয়ে অক্ষরের সমস্ত দৃষ্টান্ত প্রতিস্থাপনের পদ্ধতি )
কিছু কর্মক্ষমতা ফলাফল এখানে:
http://jsperf.com/htmlencoderegex/25

এটি replaceউপরের বিল্টিন চেইনে অভিন্ন ফলাফলের স্ট্রিং দেয় । কেউ আরও দ্রুত কেন এটি ব্যাখ্যা করতে পারলে আমি খুব খুশি হব !?

আপডেট 2015-03-04:
আমি কেবল লক্ষ্য করেছি যে AngularJS উপরের পদ্ধতিটি হুবহু ব্যবহার করছে:
https://github.com/angular/angular.js/blob/v1.3.14/src/ngSanitize/sanitize.js#L435

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

আমি লক্ষ করব যে (৪ বছর পরে) জ্যাঙ্গো এখনও এইগুলির মধ্যে একটিও করে না, সুতরাং সেগুলি কতটা গুরুত্বপূর্ণ তা আমি নিশ্চিত নই:
https://github.com/django/django/blob/1.8b1/django/utils /html.py#L44

আপডেট 2016-04-06:
আপনিও ফরোয়ার্ড-স্ল্যাশ থেকে পালাতে ইচ্ছুক হতে পারেন /। এটি সঠিক এইচটিএমএল এনকোডিংয়ের জন্য প্রয়োজন নেই, তবে এটি ওডাব্লুএএসপি দ্বারা একটি অ্যান্টি-এক্সএসএস সুরক্ষা ব্যবস্থা হিসাবে প্রস্তাবিত । (মন্তব্যগুলিতে এটি প্রস্তাব দেওয়ার জন্য @ জেএনএফকে ধন্যবাদ)

        .replace(/\//g, '/');

Comments

আপনি 'পরিবর্তে ব্যবহার করতে পারেন'

— ফের্রুসিও

@ ফেরেক্রসিও ... এবং & apos ব্যবহার করবেন না এমন কারণে দেখুন: stackoverflow.com/questions/2083754/... blogs.msdn.com/b/kirillosenkov/archive/2010/03/19/... fishbowl.pastiche.org/2003/07/01/the_curse_of_apos

— Anentropic

ধন্যবাদ, আমি কখনই বুঝতে পারি নি যে 'একটি বৈধ এইচটিএমএল সত্তা নয়।

— ফেরুরসিও

ছাড়া /g, .replace()শুধুমাত্র প্রথম ম্যাচটি প্রতিস্থাপন করবে।

— থিংকিং

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

— অ্যানেন্ট্রপিক

Answer 3

এখানে একটি নন-জিকুয়েরি সংস্করণ যা jQuery .html()সংস্করণ এবং সংস্করণ উভয়ের চেয়ে যথেষ্ট দ্রুত .replace()। এটি সমস্ত সাদা স্থান সংরক্ষণ করে, তবে jQuery সংস্করণের মতো, উদ্ধৃতিগুলি হ্যান্ডেল করে না।

function htmlEncode( html ) {
    return document.createElement( 'a' ).appendChild( 
        document.createTextNode( html ) ).parentNode.innerHTML;
};

গতি: http://jsperf.com/htmlencoderegex/17

ডেমো:

আউটপুট:

লিপি:

function htmlEncode( html ) {
    return document.createElement( 'a' ).appendChild( 
        document.createTextNode( html ) ).parentNode.innerHTML;
};

function htmlDecode( html ) {
    var a = document.createElement( 'a' ); a.innerHTML = html;
    return a.textContent;
};

document.getElementById( 'text' ).value = htmlEncode( document.getElementById( 'hidden' ).value );

//sanity check
var html = '<div>   &amp; hello</div>';
document.getElementById( 'same' ).textContent = 
      'html === htmlDecode( htmlEncode( html ) ): ' 
    + ( html === htmlDecode( htmlEncode( html ) ) );

এইচটিএমএল:

<input id="hidden" type="hidden" value="chalk    &amp; cheese" />
<input id="text" value="" />
<div id="same"></div>

Comments

এটি প্রশ্নটি জাগায়: কেন এটি ইতিমধ্যে জেএসে কোনও বিশ্বব্যাপী অনুষ্ঠান নয় ?!

— এসইওএফ

.replace()@ এসইএফ দ্বারা সম্প্রতি প্রস্তাবিত নন-রেজেক্স সংস্করণটি দ্রুততর আকার ধারণ করেছে

— অ্যান্ট্রোপিক

@ অ্যান্ট্রোপিক এটি সত্যই দ্রুত আলোকিত হচ্ছে, তবে আমি মনে করি এটি কাজ করছে না। ছাড়া /g, .replace()শুধুমাত্র প্রথম ম্যাচ করছে।

— থিংকিং

ফায়ারফক্সে আকর্ষণীয়ভাবে আপনি replace('a', 'b', 'g')একই কাজ করতে পারেন replace(/a/g, 'b')... গতি যদিও অভিন্ন তবে

— অ্যান্ট্রপিক

আমি

— উভয়ই

Answer 4

আমি জানি এটি একটি পুরানো, তবে আমি স্বীকৃত উত্তরের বিভিন্নতা পোস্ট করতে চেয়েছিলাম যা লাইনগুলি সরিয়ে না দিয়ে আইইতে কাজ করবে:

function multiLineHtmlEncode(value) {
    var lines = value.split(/\r\n|\r|\n/);
    for (var i = 0; i < lines.length; i++) {
        lines[i] = htmlEncode(lines[i]);
    }
    return lines.join('\r\n');
}

function htmlEncode(value) {
    return $('<div/>').text(value).html();
} 

Answer 5

আন্ডারস্কোর প্রদান করে _.escape()এবং _.unescape()পদ্ধতি এই কাজ।

> _.unescape( "chalk & cheese" );
  "chalk & cheese"

> _.escape( "chalk & cheese" );
  "chalk & cheese"

Comments

লোডাশেরও একই পদ্ধতি রয়েছে।

— গুস্তাভো স্ট্রাউব

Answer 6

ভাল উত্তর. নোট করুন যে এনকোডের মান যদি jQuery 1.4.2 হয় undefinedবা nullআপনি ত্রুটি পেতে পারেন যেমন:

jQuery("<div/>").text(value).html is not a function

অথবা

Uncaught TypeError: Object has no method 'html'

সমাধানটি হ'ল আসল মানটি পরীক্ষা করার জন্য ফাংশনটি সংশোধন করা:

function htmlEncode(value){ 
    if (value) {
        return jQuery('<div/>').text(value).html(); 
    } else {
        return '';
    }
}

Comments

jQuery('<div/>').text(value || '').html()

— রাউফাম্যাটিক

@ আরফাম্যাটিক - চমৎকার এক-লাইনার। তবে ফ্লাইতে একটি ডিআইভি তৈরি করতে হবে এবং এটির মান ধরার valueসাথে একটি শূন্য নন-এর জন্য পরীক্ষা করা if। এটি অনেক বেশি htmlEncodeবলা হয়ে থাকে এবং যদি সম্ভবত এটি valueখালি হয়ে যায় তবে এটি আরও বেশি পারফরম্যান্স হতে পারে।

— leepowers

হাই, এটি & বিটা করে না আপনি জানেন কেন?

— দিলীপ রাজকুমার

Answer 7

যারা সরল জাভাস্ক্রিপ্ট পছন্দ করেন তাদের জন্য, আমি এখানে পদ্ধতিটি সফলভাবে ব্যবহার করেছি:

function escapeHTML (str)
{
    var div = document.createElement('div');
    var text = document.createTextNode(str);
    div.appendChild(text);
    return div.innerHTML;
}

Answer 8

FWIW, এনকোডিংটি হারিয়ে যাচ্ছে না। এনকোডিংটি পৃষ্ঠা লোডের সময় মার্কআপ পার্সার (ব্রাউজার) দ্বারা ব্যবহৃত হয়। উত্সটি একবার পড়ার পরে এবং পার্স করা হয়ে গেলে এবং ব্রাউজারে DOM মেমরিতে লোড হয়ে যায়, এনকোডিংটি যা উপস্থাপন করে তাতে পার্স করা হয়। সুতরাং আপনার জেএস মেমোরিতে যে কোনও কিছু পড়তে চালিত হওয়ার পরে এটি যে চরটি পায় তা হ'ল এনকোডিংটি প্রতিনিধিত্ব করে।

আমি এখানে শব্দার্থবিজ্ঞানের উপর কঠোরভাবে কাজ করতে পারি, তবে আমি চাইছিলাম আপনি এনকোডিংয়ের উদ্দেশ্যটি বোঝেন। "হারিয়ে যাওয়া" শব্দটি এটিকে এমন শব্দ করে তোলে যা কিছু করা উচিত হিসাবে এটি কাজ করে না।

Answer 9

জ্যাকুরি ছাড়াই দ্রুত। আপনি আপনার স্ট্রিংয়ের প্রতিটি অক্ষরকে এনকোড করতে পারেন:

function encode(e){return e.replace(/[^]/g,function(e){return"&#"+e.charCodeAt(0)+";"})}

অথবা (এবং, অবিচ্ছিন্ন, <,>, "এবং ') এর মতো সম্পর্কে উদ্বিগ্ন হওয়ার জন্য কেবল প্রধান চরিত্রগুলিকে লক্ষ্য করুন:

function encode(r){
return r.replace(/[\x26\x0A\<>'"]/g,function(r){return"&#"+r.charCodeAt(0)+";"})
}

test.value=encode('Encode HTML entities!\n\n"Safe" escape <script id=\'\'> & useful in <pre> tags!');

testing.innerHTML=test.value;

/*************
* \x26 is &ampersand (it has to be first),
* \x0A is newline,
*************/

<textarea id=test rows="9" cols="55"></textarea>

<div id="testing">www.WHAK.com</div>

Answer 10

প্রোটোটাইপটিতে স্ট্রিং ক্লাসটি অন্তর্নির্মিত রয়েছে । সুতরাং আপনি যদি প্রোটোটাইপ ব্যবহার করার / পরিকল্পনা ব্যবহার করে থাকেন তবে এটি এমন কিছু করে:

'<div class="article">This is an article</div>'.escapeHTML();
// -> "&lt;div class="article"&gt;This is an article&lt;/div&gt;"

Comments

প্রোটোটাইপের সমাধানটি দেখার পরে, এটি এগুলিই করছে ... .replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'); যথেষ্ট সহজ।

— স্টিভ ওয়ার্থহাম

এটিও উদ্ধৃতি চিহ্নগুলি দিয়ে কিছু করা উচিত নয়? এটি ভাল নয়

— অ্যান্ট্রপিক

@ অ্যান্ট্রোপিক আমি দেখছি না কেন এর সাথে কোট দিয়ে কিছু করা দরকার; যেহেতু কোটগুলি কোনও অ্যাট্রিবিউটের মানের মধ্যে না থাকলে এড়াতে হবে না।

— অ্যান্ডি

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

— অ্যান্ডি

Answer 11

এখানে একটি সহজ জাভাস্ক্রিপ্ট সমাধান। এটি স্ট্রিং অবজেক্টকে একটি পদ্ধতি "HTMLEncode" দিয়ে প্রসারিত করে যা কোনও পরামিতি ছাড়াই বা কোনও পরামিতি ব্যবহার করে ব্যবহার করা যেতে পারে can

String.prototype.HTMLEncode = function(str) {
  var result = "";
  var str = (arguments.length===1) ? str : this;
  for(var i=0; i<str.length; i++) {
     var chrcode = str.charCodeAt(i);
     result+=(chrcode>128) ? "&#"+chrcode+";" : str.substr(i,1)
   }
   return result;
}
// TEST
console.log("stetaewteaw æø".HTMLEncode());
console.log("stetaewteaw æø".HTMLEncode("æåøåæå"))

আমি একটি সংক্ষিপ্তসার তৈরি করেছি "জাভাস্ক্রিপ্টের জন্য এইচটিএমএলঙ্কোড পদ্ধতি" ।

Answer 12

কৌণিকের স্যানিটাইজ ... (এস module মডিউল সিনট্যাক্স) এর উপর ভিত্তি করে

// ref: https://github.com/angular/angular.js/blob/v1.3.14/src/ngSanitize/sanitize.js
const SURROGATE_PAIR_REGEXP = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
const NON_ALPHANUMERIC_REGEXP = /([^\#-~| |!])/g;

const decodeElem = document.createElement('pre');


/**
 * Decodes html encoded text, so that the actual string may
 * be used.
 * @param value
 * @returns {string} decoded text
 */
export function decode(value) {
  if (!value) return '';
  decodeElem.innerHTML = value.replace(/</g, '&lt;');
  return decodeElem.textContent;
}


/**
 * Encodes all potentially dangerous characters, so that the
 * resulting string can be safely inserted into attribute or
 * element text.
 * @param value
 * @returns {string} encoded text
 */
export function encode(value) {
  if (value === null || value === undefined) return '';
  return String(value).
    replace(/&/g, '&amp;').
    replace(SURROGATE_PAIR_REGEXP, value => {
      var hi = value.charCodeAt(0);
      var low = value.charCodeAt(1);
      return '&#' + (((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000) + ';';
    }).
    replace(NON_ALPHANUMERIC_REGEXP, value => {
      return '&#' + value.charCodeAt(0) + ';';
    }).
    replace(/</g, '&lt;').
    replace(/>/g, '&gt;');
}

export default {encode,decode};

Comments

যদিও আমি সত্যিই এই উত্তরটি পছন্দ করি এবং আসলে আমার মনে হয় এটি একটি ভাল পদ্ধতির যা আমার সন্দেহ আছে, টাইপের বিটওয়াইজ অপারেটর if (value === null | value === undefined) return '';বা আসলে কোনও বৈশিষ্ট্য? যদি তা হয় তবে কেন এটি ব্যবহার করুন এবং সাধারণ নয় ||? ধন্যবাদ!!

— আলেজান্দ্রো ভেলস

@ আলেজান্দ্রোভেলস আমি পুরোপুরি নিশ্চিত যে এটি টাইপো ছিল ... সংশোধন হয়েছে।

— ট্র্যাকার 1

আচ্ছা যাইহোক যে মনে রাখবেন যে | 0 বা 1 তে নেতৃত্ব দেবে, তাই আসলে এটি কাজ করেছিল ^^

— আলেজান্দ্রো ভ্যালস

আপনি কি শুধু ব্যবহার করতে পারবেন না == null? undefinedএর সাথে সমতা থাকার একমাত্র জিনিস null, সুতরাং দুটি ট্রিপল-সমান কোনওভাবেই প্রয়োজন হয় না

— হ্যাশব্রাউন

এটা মোটেই সত্য নয় nullএবং 0উভয় মিথ্যা, হ্যাঁ, তাই আপনি ঠিক না করতে পারেন !value, তবে পুরো বিষয়টি ==হ'ল নির্দিষ্ট কিছু জিনিসকে সহজ করে তোলা। 0 == nullমিথ্যা undefined == nullসত্য. আপনি কেবল করতে পারেনvalue == null

— হ্যাশব্রাউন

Answer 13

আমি যতদূর জানি জাভাস্ক্রিপ্টে কোনও সোজা ফরোয়ার্ড এইচটিএমএল এনকোড / ডিকোড পদ্ধতি নেই।

তবে, আপনি যা করতে পারেন তা হ'ল জেএসকে একটি স্বেচ্ছাসেবী উপাদান তৈরি করতে, তার অভ্যন্তর পাঠ্য সেট করে, তারপরে এটি অভ্যন্তরীণ এইচটিএমএল ব্যবহার করে পড়ুন।

আসুন যাক, jQuery সহ, এটি কাজ করা উচিত:

var helper = $('chalk & cheese').hide().appendTo('body');
var htmled = helper.html();
helper.remove();

বা এই লাইন বরাবর কিছু।

Comments

ডাউনভোটটিকে আমি কিছুটা মজাদার বলে মনে করি, এই উত্তরটি বিবেচনা করে প্রায় 870 টিরও বেশি উর্ধ্বতন রয়েছে এবং এটির পরে কিছুটা পোস্ট করা হয়েছিল to

— কেন ইগোজি

Answer 14

একটি ইনপুট ক্ষেত্র থেকে অন্য ইনপুট ক্ষেত্রে তাদের শাটল করার জন্য আপনাকে মানগুলি থেকে বাঁচতে / এনকোড করা উচিত নয়।

<form>
 <input id="button" type="button" value="Click me">
 <input type="hidden" id="hiddenId" name="hiddenId" value="I like cheese">
 <input type="text" id="output" name="output">
</form>
<script>
    $(document).ready(function(e) {
        $('#button').click(function(e) {
            $('#output').val($('#hiddenId').val());
        });
    });
</script>

জেএস কাঁচা এইচটিএমএল বা অন্য কিছু সন্নিবেশ করায় না; এটি কেবল ডোমকে valueসম্পত্তি সেট করতে বলে (বা বৈশিষ্ট্য; নিশ্চিত নয়)। যে কোনও উপায়ে, ডিওএম আপনার জন্য কোনও এনকোডিং সমস্যা পরিচালনা করে। আপনি ব্যবহার document.writeবা মত মত বিজোড় কিছু না করেeval এইচটিএমএল-এনকোডিং কার্যকরভাবে স্বচ্ছ হবে।

আপনি যদি ফলাফলটি ধরে রাখতে একটি নতুন পাঠ্যবক্স তৈরি করার কথা বলছেন ... এটি এখনও তত সহজ। এইচটিএমএলটির স্থির অংশটি কেবল jQuery এ পাস করুন, এবং তারপরে বাকি বৈশিষ্ট্যগুলি / বৈশিষ্ট্যগুলি সেট করুন যা এটি আপনাকে ফিরিয়ে দেয়।

$box = $('<input type="text" name="whatever">').val($('#hiddenId').val());

Answer 15

আমার একই সমস্যা ছিল এবং encodeURIComponentজাভাস্ক্রিপ্ট ( ডকুমেন্টেশন ) থেকে ফাংশনটি ব্যবহার করে এটি সমাধান করুন

উদাহরণস্বরূপ, আপনার ক্ষেত্রে যদি আপনি ব্যবহার করেন:

<input id='hiddenId' type='hidden' value='chalk & cheese' />

এবং

encodeURIComponent($('#hiddenId').attr('value'))

আপনি পাবেন chalk%20%26%20cheese। এমনকি জায়গা রাখা হয়।

আমার ক্ষেত্রে, আমাকে একটি ব্যাকস্ল্যাশ এনকোড করতে হয়েছিল এবং এই কোডটি পুরোপুরি কার্যকর করে

encodeURIComponent('name/surname')

এবং আমি পেয়েছিলাম name%2Fsurname

Answer 16

Server.HTMLEncodeখাঁটি জাভাস্ক্রিপ্টে লিখিত মাইক্রোসফ্টের এএসপি থেকে ফাংশনটি অনুকরণ করে এমন কিছুটা এখানে দেওয়া হয়েছে :

function htmlEncode(s) {
  var ntable = {
    "&": "amp",
    "<": "lt",
    ">": "gt",
    "\"": "quot"
  };
  s = s.replace(/[&<>"]/g, function(ch) {
    return "&" + ntable[ch] + ";";
  })
  s = s.replace(/[^ -\x7e]/g, function(ch) {
    return "&#" + ch.charCodeAt(0).toString() + ";";
  });
  return s;
}

ফলাফল অ্যাডাস্টোফেসগুলি এনকোড করে না , তবে অন্যান্য এইচটিএমএল বিশেষ এবং 0x20-0x7e সীমার বাইরে থাকা কোনও অক্ষরকে এনকোড করে।

Answer 17

আমার খাঁটি-জেএস ফাংশন:

/**
 * HTML entities encode
 *
 * @param {string} str Input text
 * @return {string} Filtered text
 */
function htmlencode (str){

  var div = document.createElement('div');
  div.appendChild(document.createTextNode(str));
  return div.innerHTML;
}

জাভাস্ক্রিপ্ট এইচটিএমএল সত্তা এনকোড এবং ডিকোড

Answer 18

আপনি যদি jQuery ব্যবহার করতে চান। আমি এটি খুঁজে পেয়েছি:

http://www.jquerysdk.com/api/jQuery.htmlspecialchars

(jQuery SDK অফার jquery.string প্লাগইন অংশ)

আমার বিশ্বাস প্রোটোটাইপের সমস্যাটি হ'ল এটি জাভাস্ক্রিপ্টে বেস অবজেক্টগুলিকে প্রসারিত করে এবং আপনি ব্যবহার করেছেন এমন কোনও jQuery এর সাথে বেমানান। অবশ্যই, আপনি যদি ইতিমধ্যে প্রোটোটাইপ ব্যবহার করেন এবং jQuery না করেন তবে সমস্যা হবে না।

সম্পাদনা: এছাড়াও এটি রয়েছে, যা jQuery এর জন্য প্রোটোটাইপের স্ট্রিং ইউটিলিটিগুলির একটি বন্দর:

http://stilldesigning.com/dotstring/

Answer 19

var htmlEnDeCode = (function() {
    var charToEntityRegex,
        entityToCharRegex,
        charToEntity,
        entityToChar;

    function resetCharacterEntities() {
        charToEntity = {};
        entityToChar = {};
        // add the default set
        addCharacterEntities({
            '&'     :   '&',
            '>'      :   '>',
            '&lt;'      :   '<',
            '&quot;'    :   '"',
            '&#39;'     :   "'"
        });
    }

    function addCharacterEntities(newEntities) {
        var charKeys = [],
            entityKeys = [],
            key, echar;
        for (key in newEntities) {
            echar = newEntities[key];
            entityToChar[key] = echar;
            charToEntity[echar] = key;
            charKeys.push(echar);
            entityKeys.push(key);
        }
        charToEntityRegex = new RegExp('(' + charKeys.join('|') + ')', 'g');
        entityToCharRegex = new RegExp('(' + entityKeys.join('|') + '|&#[0-9]{1,5};' + ')', 'g');
    }

    function htmlEncode(value){
        var htmlEncodeReplaceFn = function(match, capture) {
            return charToEntity[capture];
        };

        return (!value) ? value : String(value).replace(charToEntityRegex, htmlEncodeReplaceFn);
    }

    function htmlDecode(value) {
        var htmlDecodeReplaceFn = function(match, capture) {
            return (capture in entityToChar) ? entityToChar[capture] : String.fromCharCode(parseInt(capture.substr(2), 10));
        };

        return (!value) ? value : String(value).replace(entityToCharRegex, htmlDecodeReplaceFn);
    }

    resetCharacterEntities();

    return {
        htmlEncode: htmlEncode,
        htmlDecode: htmlDecode
    };
})();

এটি এক্সটجےএস উত্স কোড থেকে।

Answer 20

<script>
String.prototype.htmlEncode = function () {
    return String(this)
        .replace(/&/g, '&amp;')
        .replace(/"/g, '&quot;')
        .replace(/'/g, '&#39;')
        .replace(/</g, '&lt;')
        .replace(/>/g, '&gt;');

}

var aString = '<script>alert("I hack your site")</script>';
console.log(aString.htmlEncode());
</script>

আউটপুট দেবে: <script>alert("I hack your site")</script>

.htmlEncode () একবার সংজ্ঞায়িত হয়ে গেলে সমস্ত স্ট্রিংয়ের অ্যাক্সেসযোগ্য হবে।

Answer 21

এইচটিএমএল প্রদত্ত মানকে কোড করে

  var htmlEncodeContainer = $('<div />');
  function htmlEncode(value) {
    if (value) {
      return htmlEncodeContainer.text(value).html();
    } else {
      return '';
    }
  }

Answer 22

আমি আমার ডোমেন-ব্যবহারকারীর স্ট্রিংয়ে ব্যাকস্ল্যাশ নিয়ে কিছু সমস্যা নিয়ে এসেছি।

আমি এ্যান্ট্রপিকের উত্তর থেকে পালিয়ে আসা অন্যান্যদের সাথে এটি যুক্ত করেছিলাম

.replace(/\\/g, '\')

যা আমি এখানে পেয়েছি: জাভাস্ক্রিপ্টে ব্যাকস্ল্যাশ এড়াতে কীভাবে?

Answer 23

escapeHTML()প্রোটোটাইপ.জেজে কী করছে তা বাছাই করা

এই স্ক্রিপ্টটি যুক্ত করা আপনাকে HTML থেকে পালাতে সহায়তা করে:

String.prototype.escapeHTML = function() { 
    return this.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;')
}

এখন আপনি আপনার স্ক্রিপ্টের স্ট্রিংগুলিতে এসএইচটিএমএল পদ্ধতিতে কল করতে পারেন, যেমন:

var escapedString = "<h1>this is HTML</h1>".escapeHTML();
// gives: "&lt;h1&gt;this is HTML&lt;/h1&gt;"

আশা করি এটি সম্পূর্ণ প্রোটোটাইপ.জেএসকে অন্তর্ভুক্ত না করেই যে কোনও সহজ সমাধান সন্ধান করতে সহায়তা করবে

Answer 24

এখানে অন্যান্য উত্তরগুলির কয়েকটি ব্যবহার করে আমি একটি সংস্করণ তৈরি করেছি যা পৃথক এনকোডেড অক্ষরের সংখ্যা নির্বিশেষে একটি পাসে সমস্ত প্রাসঙ্গিক অক্ষরকে প্রতিস্থাপন করে (কেবলমাত্র একটি কল replace()) তাই বড় স্ট্রিংয়ের জন্য দ্রুততর হবে।

এটি বিদ্যমান থাকতে DOM এপিআই বা অন্যান্য লাইব্রেরিতে নির্ভর করে না।

window.encodeHTML = (function() {
    function escapeRegex(s) {
        return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
    }
    var encodings = {
        '&'  : '&',
        '"'  : '"',
        '\'' : ''',
        '<'  : '&lt;',
        '>'  : '&gt;',
        '\\' : '&#x2F;'
    };
    function encode(what) { return encodings[what]; };
    var specialChars = new RegExp('[' +
        escapeRegex(Object.keys(encodings).join('')) +
    ']', 'g');

    return function(text) { return text.replace(specialChars, encode); };
})();

একবার দৌড়ানোর পরে, আপনি এখন কল করতে পারেন

encodeHTML('<>&"\'')

পেতে <>&"'

Answer 25

function encodeHTML(str) {
    return document.createElement("a").appendChild( 
        document.createTextNode(str)).parentNode.innerHTML;
};

function decodeHTML(str) {
    var element = document.createElement("a"); 
    element.innerHTML = str;
    return element.textContent;
};
var str = "<"
var enc = encodeHTML(str);
var dec = decodeHTML(enc);
console.log("str: " + str, "\nenc: " + enc, "\ndec: " + dec);