jQuery Check if String is HTML Tag

Question

I just need to check if a string is a HTML Tag or not. I've searched in google and tried codes below, but no success:

var v = $(string).html() ? 1 : 0;

--or----------------------------------------------

var htmlExpr = new RegExp("/^(?:[^<]*(<[\w\W]+>)[^>]*$|#([\w\-]+)$)/");
var v = htmlExpr.test(string) ? 1 : 0;

--or----------------------------------------------

var v = $(string).each(function(){$(this).html();} ? 1 : 0;

====

Actually I want to check if the string is an img tag, get the alt attribute of it and if is not (it's a normal non-html string) get the whole of it.

Please help me with this problem... Thanks

====

Let me show you a true example with all side details...

This is the main function:

content.find('a').each(function () {
    var $this = $(this),
        optText = '&nbsp;' + $this.text(),
        ...,
        ...,
        ...;
    ...
    ...
    ...
}

in this function, I need to process the "$this.text()" part in the 3rd line.

The text in a tag which we are looking for, sometimes contains a normal string and sometimes includes an img tag. When it is a normal text, I want to put it in optText variable completely; But when it is an img tag, I just want to put it's alt attribute in that variable.

So briefly:

$this.text() => NormalText

--or----------------------------------------------

$this.text() => <img src="#" alt="AltText" />

So I've changed that function and replaced the "$this.text()" code in the third line with each of these codes:

($this.text().html() ? $('img', $this.text()).attr('alt') : $this.text())

--or----------------------------------------------

(htmlExpr.test($this.text()) ? $('img', $this.text()).attr('alt') : $this.text())

[which htmlExpr was defined before...]

--or----------------------------------------------

($this.text().each(function(){$(this).html();}) ? $('img', $this.text()).attr('alt') : $this.text())

but none of these codes worked for me...

Now, Can you help me please?!

Provide a sample string ... – Prasath K Jun 25 '13 at 05:29 — Prasath K, Jun 25 '13 at 05:29

SomeShinyObject · Answer 1 · 2013-06-25T05:43:13.033

3

Something like this?:

var str = "<img alt='hello'>";

if(str.match(/\<img.+\>/)) {
    str = $(str).attr('alt');
}

It takes the string, checks if it's an img element, and then gets the alt attribute. A simpler way would be to just check for alt in the if statement:

if($(str).attr('alt')) {
    str = $(str).attr('alt');
}

You can also use is() and attr() combined:

if($(str).is('img') && $(str).attr('alt')) {
    str = $(str).attr('alt');
}

edited Jun 25 '13 at 05:43

answered Jun 25 '13 at 05:30

SomeShinyObject

7,581
6
39
59

Thanks for the last part... It seems to be easier and more clear than the REGEX method. – PRO MAX Jun 26 '13 at 06:30
I know dude... but there is some time restrictions at the mean time... I'll do it ASAP. – PRO MAX Jun 26 '13 at 08:08

score 0 · Answer 2 · answered Jun 25 '13 at 05:32

If you just want to check if it's an image and has an alt attribute try this regex:

/(?=.*alt=".+")<img.*?\/?>/

Quick test:

var str1 = '<img src="http://dot.com/test.jpg" alt="test"/>';
var str2 = '<img src="http://dot.com/test.jpg" alt="" />';
var str3 = '<input/>';

console.log(img.test(str1)); //= true
console.log(img.test(str2)); //= false
console.log(img.test(str3)); //= false

Jashwant · Answer 3 · 2013-06-25T06:18:59.960

0

Does this help ?

Demo

var samples = ["<img src='#' alt='img1' />","hello","bye","<img src='#' alt='img2' />"];
for(var i = 0, len = samples.length; i < len; i++) {
    if($(samples[i]).length > 0) {
        alert($(samples[i]).attr('alt'));
    }    
}

edited Jun 25 '13 at 06:18

answered Jun 25 '13 at 06:07

Jashwant

28,410
16
70
105

Why was this answer downvoted? It does appear to correctly check for img elements and retrieve their alt attributes. – doppelgreener Jun 25 '13 at 06:20
It is a fashion, as was brought up in that meta discussion. It's not a good fashion though. :P – doppelgreener Jun 25 '13 at 06:20
I agree, semantics should be at the top. But there's no way here to highlight link. See comment on my question here, http://stackoverflow.com/questions/16372162/raphael-js-fill-color-along-a-curve. A guy literally forced me to use `kbd`. – Jashwant Jun 25 '13 at 06:23
I would have pointed out to the guy there were several links in the post already, if he'd look for them. :) – doppelgreener Jun 25 '13 at 06:57

score 0 · Accepted Answer · edited Jul 22 '13 at 16:24

0

I found the problem myself... It was a logical error...

the point is that when the string is a normal text, we can take it with using text(), but when it is HTML we should use html() instead, otherwise the text() returns null...

I've also learned something from you guys... Thank you all very much... ;)

edited Jul 22 '13 at 16:24

allicarn

2,859
2
28
47

answered Jun 25 '13 at 12:15

PRO MAX

87
3
11

jQuery Check if String is HTML Tag

4 Answers4