CODEWITHSUNDEEP
javascriptjqueryhtml
STEAMworks Learning Center
STEAMworks Learning Center

Reputation: 1187

Javascript: Can't pull the .text() from an html tag

I'm editing this to add my solution based on georg's answer. The solution is at the bottom.

I am trying to get the enclosed text from a given tag using.

var substring = txt.find(tag).eq(i).text();

Sample Data:

The variable tag holds "h1".

The variable txt holds "<p>one.</p><h1>fish</h1><p>two fish. red fish. blue fish.</p>".

The Expectation:

subString == "fish"

The Result:

subString == null

Code: 

this.mpactIdeation_getTagContentsKeyphrase = function( tag, kp ) {
    try {
        var result = 0;
        var num = 0;
        var txt = this.oText;

        var tagcount = this._mpactIdeation_countOccurrences( txt, tag, false );

        txt = jQuery(txt);

        for (i = 0; i < tagcount; i++) {
            tag = this._mpactIdeation_tagToText(tag);
            var substring = txt.find(tag).eq(i).text();
            result += this._mpactIdeation_countOccurrences(substring, kp, false);
        }

        return result;
    }  catch(e) {
        console.log(e);
        return false;
    }
}

Solution:

    this.mpactIdeation_getTagContentsKeyphrase = function( tag, kp ) {
        try {
            var result = 0;
            var num = 0;
            var txt = this.oText;

            var tagcount = this._mpactIdeation_countOccurrences( txt, tag, false );

            for (i = 0; i < tagcount; i++) {
                tag = this._mpactIdeation_tagToText(tag);
                var substring = jQuery('<div>').html(txt).find(tag).eq(i).text();
                result += this._mpactIdeation_countOccurrences(substring, kp, false);
            }

            return result;
        }  catch(e) {
            console.log(e);
            return false;
        }
    }

Upvotes: 0

Views: 69

Answers (3)

Shashank
Shashank

Reputation: 2060

I have tried doing in a similar fashion and was able to do it quite well.

Please refer demo.

Code below:

HTML:

 <div class="test">Test div 1</div>
 <div class="test">Test div 2</div>
 <div class="test">Test div 3</div>


<div class="newDiv"><p>New Div</p></div>

JS:

     $(function(){
          var len = document.getElementsByClassName('test').length;
          for(var i = 0; i<len;i++){
          var test = $('.test').eq(i).text();

          $('.newDiv').append('<br>Loop ' + (i+1) + ' text = ' + test);
          }
      });

Upvotes: 0

georg
georg

Reputation: 214959

To use find you have to put your html in a container:

txt = "<p>one.</p><h1>fish</h1><p>two fish. red fish. blue fish.</p>";

result = $('<div>').html(txt).find('h1').text()

alert(result);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Upvotes: 1

Ahs N
Ahs N

Reputation: 8366

This is how I would do it:

var tag="h1"
var txt = "<p>one.</p><h1>fish</h1><p>two fish. red fish. blue fish.</p>";


var result = txt.match(new RegExp("<"+tag+">(.*)</"+tag+">"));
console.log(result[1]);

alert(result[1]);

Here is the JSFiddle demo

The string was filtered using the tag u provided via regex and the text between the tags are shown as a message.

Upvotes: 0

Related Questions