কোনও স্ট্রিং এইচটিএমএল কিনা তা পরীক্ষা করে দেখুন

Question 1

আমার একটি নির্দিষ্ট স্ট্রিং রয়েছে যার জন্য আমি এটিটি এইচটিএমএল কিনা তা যাচাই করতে চাই। আমি একই জন্য রেজেক্স ব্যবহার করছি তবে সঠিক ফলাফল পাচ্ছি না।

আমি আমার রেজেক্সকে বৈধতা দিয়েছি এবং এটি এখানে দুর্দান্ত কাজ করে ।

var htmlRegex = new RegExp("<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)</\1>");
return htmlRegex.test(testString);

এখানে হুড়োহুড়ি কিন্তু রেজেেক্স সেখানে চলছে না। http://jsfiddle.net/wFWtc/

আমার মেশিনে, কোডটি ঠিকঠাক হয় তবে ফল হিসাবে সত্যের পরিবর্তে আমি একটি মিথ্যা পাই। এখানে কি অনুপস্থিত?

Question 2

কোনও স্ট্রিং এইচটিএমএল কিনা তা পরীক্ষা করার জন্য আরও ভাল রেগেক্স ব্যবহার করতে হবে:

/^/

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

/^/.test('') // true
/^/.test('foo bar baz') //true
/^/.test('<p>fizz buzz</p>') //true

আসলে, এটা খুব ভাল, এটা ফিরে আসবেন trueজন্য যে এটি পাস স্ট্রিং, যা কারণ যে স্ট্রিং এইচটিএমএল হয় । মারাত্মকভাবে, এমনকি এটি খারাপভাবে ফর্ম্যাট করা বা অবৈধ হলেও এটি এখনও এইচটিএমএল।

আপনি যা সন্ধান করছেন তা হ'ল এইচটিএমএল উপাদানগুলির উপস্থিতি, কেবল কোনও পাঠ্য সামগ্রীর চেয়ে, আপনি কিছু লাইন ধরে ব্যবহার করতে পারেন:

/<\/?[a-z][\s\S]*>/i.test()

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

Question 3

পদ্ধতি # 1 । স্ট্রিংটিতে এইচটিএমএল ডেটা রয়েছে কিনা তা পরীক্ষা করার জন্য এখানে সহজ কাজ রয়েছে:

function isHTML(str) {
  var a = document.createElement('div');
  a.innerHTML = str;

  for (var c = a.childNodes, i = c.length; i--; ) {
    if (c[i].nodeType == 1) return true; 
  }

  return false;
}

ব্রাউজারের ডিওএম পার্সারটিকে সরবরাহের স্ট্রিংটি এইচটিএমএল এর মতো দেখায় বা না দেখায় তা সিদ্ধান্ত নিতে অনুমতি দেওয়া হয়। আপনি দেখতে পাচ্ছেন এটি কেবল ELEMENT_NODE( nodeType1 এর) জন্য পরীক্ষা করে ।

আমি বেশ কয়েকটি পরীক্ষা করেছি এবং দেখে মনে হচ্ছে এটি কার্যকর হয়:

isHTML('<a>this is a string</a>') // true
isHTML('this is a string')        // false
isHTML('this is a <b>string</b>') // true

এই দ্রষ্টব্যটি সঠিকভাবে এইচটিএমএল স্ট্রিং সনাক্ত করতে পারে তবে এর পার্শ্ব প্রতিক্রিয়া রয়েছে যা ইম্জি / ভিডিও / ইত্যাদি। ট্যাগগুলি একবার অভ্যন্তরীণ এইচটিএমএলে পার্স করা সংস্থান ডাউনলোড শুরু করবে start

পদ্ধতি # 2 । অন্য একটি পদ্ধতি DOMParser ব্যবহার করে এবং লোডিং সংস্থানগুলির পার্শ্ব প্রতিক্রিয়া নেই:

function isHTML(str) {
  var doc = new DOMParser().parseFromString(str, "text/html");
  return Array.from(doc.body.childNodes).some(node => node.nodeType === 1);
}

_{দ্রষ্টব্য:
1. Array.fromES2015 পদ্ধতি, এর সাথে প্রতিস্থাপন করা যেতে পারে [].slice.call(doc.body.childNodes)।
২. someকলের তীর ফাংশনটি সাধারণ বেনাম ফাংশন দিয়ে প্রতিস্থাপন করা যেতে পারে।}

Question 4

এর সাথে কিছুটা বৈধতা:

/<(?=.*? .*?\/ ?>|br|hr|input|!--|wbr)[a-z]+.*?>|<([a-z]+).*?<\/\1>/i.test(htmlStringHere)

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

বর্ণিত ডেমো: http://regex101.com/r/cX0eP2

হালনাগাদ:

এর সাথে সম্পূর্ণ বৈধতা:

/<(br|basefont|hr|input|source|frame|param|area|meta|!--|col|link|option|base|img|wbr|!DOCTYPE).*?>|<(a|abbr|acronym|address|applet|article|aside|audio|b|bdi|bdo|big|blockquote|body|button|canvas|caption|center|cite|code|colgroup|command|datalist|dd|del|details|dfn|dialog|dir|div|dl|dt|em|embed|fieldset|figcaption|figure|font|footer|form|frameset|head|header|hgroup|h1|h2|h3|h4|h5|h6|html|i|iframe|ins|kbd|keygen|label|legend|li|map|mark|menu|meter|nav|noframes|noscript|object|ol|optgroup|output|p|pre|progress|q|rp|rt|ruby|s|samp|script|section|select|small|span|strike|strong|style|sub|summary|sup|table|tbody|td|textarea|tfoot|th|thead|time|title|tr|track|tt|u|ul|var|video).*?<\/\2>/i.test(htmlStringHere)

এটি যথাযথ বৈধতা দেয় কারণ এতে সমস্ত এইচটিএমএল ট্যাগ রয়েছে , খালিগুলি প্রথমে বাকী অনুসরণ করে যার জন্য একটি ক্লোজিং ট্যাগ প্রয়োজন।

এখানে বর্ণিত ডেমো: http://regex101.com/r/pE1mT5

Question 5

উপরের zzzzBov এর উত্তর ভাল, তবে এটি বিপথগামী ক্লোজিং ট্যাগগুলির জন্য অ্যাকাউন্ট নয়, যেমন:

/<[a-z][\s\S]*>/i.test('foo </b> bar'); // false

এমন একটি সংস্করণ যা ক্লোজিং ট্যাগগুলি ক্যাচ করে এটি হতে পারে:

/<[a-z/][\s\S]*>/i.test('foo </b> bar'); // true

Question 6

এখানে সময়ে সময়ে আমি ব্যবহার করি এমন একটি স্লোপ ওয়ান-লাইনার:

var isHTML = RegExp.prototype.test.bind(/(<([^>]+)>)/i);

এটি মূলত ফিরে আসবে trueএকটি ধারণকারী স্ট্রিং জন্য <দ্বারা অনুসরণ ANYTHINGদ্বারা অনুসরণ >।

দ্বারা ANYTHING, আমি মূলত একটি খালি স্ট্রিং ছাড়া কিছুই বোঝাতে চাই।

এটি দুর্দান্ত নয়, তবে এটি ওয়ান লাইনার।

ব্যবহার

isHTML('Testing');               // false
isHTML('<p>Testing</p>');        // true
isHTML('<img src="hello.jpg">'); // true
isHTML('My < weird > string');   // true (caution!!!)
isHTML('<>');                    // false

আপনি দেখতে পাচ্ছেন যে এটি নিখুঁত থেকে অনেক দূরে, তবে কিছু ক্ষেত্রে এটি আপনার পক্ষে কাজ করতে পারে।

Question 7

এখানে সমস্ত উত্তর অতিরিক্ত-সমেত রয়েছে, সেগুলি কেবল <অনুসরণ অনুসরন করে >। কোনও স্ট্রিং এইচটিএমএল কিনা তা সনাক্ত করার কোনও সঠিক উপায় নেই তবে আপনি আরও ভাল করতে পারেন।

নীচে আমরা শেষ ট্যাগগুলি সন্ধান করি এবং এটি আরও কঠোর এবং আরও নির্ভুল হবে:

import re
re_is_html = re.compile(r"(?:</[^<]+>)|(?:<[^<]+/>)")

এবং এখানে এটি কার্যকর হয়:

# Correctly identified as not HTML:
print re_is_html.search("Hello, World")
print re_is_html.search("This is less than <, this is greater than >.")
print re_is_html.search(" a < 3 && b > 3")
print re_is_html.search("<<Important Text>>")
print re_is_html.search("<a>")

# Correctly identified as HTML
print re_is_html.search("<a>Foo</a>")
print re_is_html.search("<input type='submit' value='Ok' />")
print re_is_html.search("<br/>")

# We don't handle, but could with more tweaking:
print re_is_html.search("<br>")
print re_is_html.search("Foo &amp; bar")
print re_is_html.search("<input type='submit' value='Ok'>")

Question 8

যদি আপনি একটি স্ট্রিং আক্ষরিক থেকে একটি রেজেক্স তৈরি করে থাকেন তবে আপনাকে কোনও ব্যাকস্ল্যাশ থেকে বাঁচতে হবে:

var htmlRegex = new RegExp("<([A-Za-z][A-Za-z0-9]*)\\b[^>]*>(.*?)</\\1>");
// extra backslash added here ---------------------^ and here -----^

আপনি যদি একটি রেজেক্স আক্ষরিক ব্যবহার করেন তবে এটি প্রয়োজনীয় নয় তবে তারপরে আপনাকে এগিয়ে স্ল্যাশগুলি থেকে বাঁচতে হবে:

var htmlRegex = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)<\/\1>/;
// forward slash escaped here ------------------------^

এছাড়াও আপনার jsfiddle কাজ করেনি কারণ আপনি onloadঅন্য হ্যান্ডলারের ভিতরে কোনও onloadহ্যান্ডলারকে বরাদ্দ করেছেন - বামদিকে ফ্রেমওয়ার্ক এবং এক্সটেনশানস প্যানেলে সেট করা ডিফল্টটি জেএসকে মোড়কে onload। এটিকে এখনি্যাপ বিকল্পে পরিবর্তন করুন এবং স্ট্রিং আক্ষরিক অব্যাহতিটি ঠিক করুন এবং এটি "কাজ করে" (প্রত্যেকেই মন্তব্যগুলিতে চিহ্নিত করেছেন এমন বাঁধাগুলির মধ্যে): http://jsfiddle.net/wFWtc/4/

আমি যতদূর জানি জাভাস্ক্রিপ্টের নিয়মিত এক্সপ্রেশনগুলির ব্যাক-রেফারেন্স নেই। সুতরাং আপনার প্রকাশের এই অংশ:

~~</\1>~~

~~জেএসে কাজ করবে না (তবে অন্য কয়েকটি ভাষায় কাজ করবে)।~~

Question 9

/<\/?[^>]*>/.test(str) এটিতে এইচটিএমএল ট্যাগ রয়েছে কিনা তা সনাক্ত করুন, এটি কোনও এক্সএমএল হতে পারে

Question 10

JQuery সহ:

function isHTML(str) {
  return /^<.*?>$/.test(str) && !!$(str)[0];
}

Question 11

এই ক্ষেত্রে jQuery ব্যবহার করে, সহজ ফর্মটি হ'ল:

if ($(testString).length > 0)

যদি $(testString).length = 1, এর অর্থ এটির ভিতরে একটি HTML ট্যাগ রয়েছে textStging।

Question 12

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

Q1: একটি স্ট্রিংতে কি এইচটিএমএল টুকরা রয়েছে?

এইচটিএমএল উপাদান চিহ্নিতকরণ বা এনকোড সত্তা সমন্বিত এইচটিএমএল নথির স্ট্রিং অংশ ? এটি একটি সূচক হিসাবে ব্যবহার করা যেতে পারে যে স্ট্রিংয়ের জন্য ব্লিচিং / স্যানিটাইজেশন বা সত্তা ডিকোডিংয়ের প্রয়োজন হতে পারে:

/</?[a-z][^>]*>|(\&(?:[\w\d]+|#\d+|#x[a-f\d]+);/

এই লেখার সময় আপনি বিদ্যমান বিদ্যমান উত্তর থেকে সমস্ত উদাহরণের বিপরীতে ব্যবহার করতে পারেন এবং আরও কিছু… বরং ঘৃণ্য WYSIWYG- বা শব্দ-উত্পন্ন নমুনা পাঠ্য এবং বিভিন্ন চরিত্রের সত্তার উল্লেখগুলি।

প্রশ্ন 2: স্ট্রিংটি কি এইচটিএমএল ডকুমেন্ট?

এইচটিএমএল স্পেসিফিকেশন অত্যন্ত আপত্তিকররূপে কি এটি একটি HTML ডকুমেন্ট বিবেচনায় হিসেবে শিথিল । ব্রাউজারগুলি এইচটিএমএল হিসাবে প্রায় কোনও আবর্জনা পাঠকে পার্স করতে চরম দৈর্ঘ্যে চলে যায় to দুটি পদ্ধতির: হয় কেবল HTML- কে সব কিছু বিবেচনা করুন (যেহেতু যদি কোনও text/htmlবিষয়বস্তুর সাথে সরবরাহ করা হয় তবে ব্যবহারকারী-এজেন্ট দ্বারা এটি HTML হিসাবে ব্যাখ্যা করার চেষ্টা করার জন্য দুর্দান্ত প্রচেষ্টা ব্যয় করা হবে ) বা উপসর্গ চিহ্নিতকারীটির সন্ধান করুন:

<!DOCTYPE html>

"সুগঠিততা" এর নিরিখে, এটি এবং অন্য কোনও কিছুই "প্রয়োজনীয়" নয়। নীচেরটি একটি 100% সম্পূর্ণ, সম্পূর্ণ বৈধ এইচটিএমএল ডকুমেন্ট যা আপনার মনে হয় যে প্রতিটি HTML উপাদান বাদ দেওয়া হচ্ছে:

<!DOCTYPE html>
<title>Yes, really.</title>
<p>This is everything you need.

হা. সেখানে কিভাবে যেমন "অনুপস্থিত" উপাদান গঠন উপর স্পষ্ট নিয়ম আছে <html>, <head>এবং <body>। যদিও আমি এটি বরং মজাদার বলে মনে করি যে এসও এর সিনট্যাক্স হাইলাইটিং সুস্পষ্ট ইঙ্গিত ছাড়াই সঠিকভাবে এটি সনাক্ত করতে ব্যর্থ হয়েছিল।

Question 13

আমার সমাধানটি হ'ল

const element = document.querySelector('.test_element');

const setHtml = elem =>{
    let getElemContent = elem.innerHTML;

    // Clean Up whitespace in the element
    // If you don't want to remove whitespace, then you can skip this line
    let newHtml = getElemContent.replace(/[\n\t ]+/g, " ");

    //RegEX to check HTML
    let checkHtml = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)<\/\1>/.test(getElemContent);

    //Check it is html or not
    if (checkHtml){
        console.log('This is an HTML');
        console.log(newHtml.trim());
    }
    else{
        console.log('This is a TEXT');
        console.log(elem.innerText.trim());
    }
}

setHtml(element);

Question 14

এইচটিএমএল-এর একটি এনপিএম প্যাকেজ রয়েছে যা এই https://github.com/sindresorhus/is-html সমাধান করার চেষ্টা করতে পারে