Check if a text is HTML or not

Question

I am using Meteor and I am trying to check if a text is html. But usual ways do not work. This is my code:

post: function() {
    var postId = Session.get("postId");
    var post = Posts.findOne({
        _id: postId
    });
    var object = new Object();
    if (post) {
        object.title = post.title;
        if ($(post.content).has("p")) { //$(post.content).has("p") / post.content instanceof HTMLElement


            object.text = $(post.content).text();


            if (post.content.match(/<img src="(.*?)"/)) {
                object.image = post.content.match(/<img src="(.*?)"/)[1];
            }
        } else {
            console.log("it is not an html------------------------");
            object.text = post.content;
        }
    }
    return object;
}

Actually, this is the most "working" solution I have used up to now. Also, I pointed out the two most common ways which I use (next to the if statement). Is it possible to happen without regex.

Can you be more specific on what exact parts of HTML you would like to detect? Technically, this comment is valid HTML, but I assume you don't want to detect plain text. — Tennyson H, Feb 05 '16 at 22:30
See this answer: https://stackoverflow.com/questions/15458876/check-if-a-string-is-html-or-not it has a regex for detecting HTML elements. `/<[a-z][\s\S]*>/i.test()` — Tennyson H, Feb 05 '16 at 22:31
Actually in the html I want to detect there are and
tags, so I use .text(), in order to obtain only the text, not out of the tags. But there are some occasions when the user input is only text, without tags. — StefanL19, Feb 05 '16 at 22:33
Thank you Tennyson H, it works perfectly. Also I learned a lot from the the answer. — StefanL19, Feb 05 '16 at 22:38
Possible duplicate of [RegEx match open tags except XHTML self-contained tags](http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags) — Quill, Feb 05 '16 at 22:42

charlietfl · Accepted Answer · 2016-02-05T23:10:34.223

8

Can use approach you already started with jQuery but append response to a new <div> and check if that element has children. If jQuery finds children it is html.

If it is html you can then search that div for any type of element using find().

// create element and inject content into it
var $div=$('<div>').html(post.content);
// if there are any children it is html
if($div.children().length){
   console.log('this is html');
   var $img = $div.find('img');
   console.log('There are ' + $img.length +' image(s)');
}else{
   console.log('this is not html');
}

edited Feb 05 '16 at 23:10

answered Feb 05 '16 at 22:54

charlietfl

170,828
13
121
150

Thank you, actually this will help me to implement some other functionalities of my app.Together with the HTML validation. – StefanL19 Feb 05 '16 at 22:57
1

is a bit more versatile than using a bunch of different regex – charlietfl Feb 05 '16 at 22:57
err! opening doors to XSS attacks – Fr0zenFyr Oct 01 '18 at 06:09

stomtech · Answer 2 · 2018-09-13T18:51:54.310

Use the jquery $.parseHTML function to parse the string into an array of DOM nodes and check if it has any HTMLElement.

var htmlText = "----<b>abc</b>----<h3>GOOD</h3>----";
htmlText = prompt("Please enter something:", "----<b>abc</b>----");

var htmlArray = $.parseHTML(htmlText);

var isHtml = htmlArray.filter(function(e){ return e instanceof HTMLElement;}).length;

console.log(htmlText);
//console.log(htmlArray);

if (isHtml)
  console.log(isHtml + " HTML Element(s) found.");
else
  console.log("No HTML Elements found!");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Check if a text is HTML or not

2 Answers2

Linked