1

So I've been trying to do $(document).match(/regexp/); and I keep getting "undefined is not a function"

When I do $(document)html().match(/regexp/); TypeError: Cannot read property 'match' of undefined

The regexp I'm using is /^[~{.*?}~]$/ All I want to do is search the html document for [~{ any kind of input }~] so that I can then replace it with the right code using jQuery. Essentially, I'll be creating my own templating engine. The current ones, either don't do what I need, or are over bloated.

<body>

    [~{ header }~]


    <p>This is the home page</p>


    [~{ footer }~]

</body>

So I guess I wasn't clear, what I need to do is find text within "[~{" and "}~]". Then after placing it within a variable and determining what to do with it, I'll then find the entire expression again, but this time I'll replace it with other content.

So

[~{ header }~]

I would find this with match or something, extract the "header" text into a variable. From there I'll have it go through a function. The function will return something to do like retrieve getting an html page and load it. But it'll then have to find the expression again to replace it.

jemiloii
  • 24,594
  • 7
  • 54
  • 83
  • So basically you want to use regex to create a templating engine? Sounds splendid. – adeneo Apr 18 '14 at 20:54
  • yeah, I figured that I could just find an text node and then replace it with content or load a page. – jemiloii Apr 18 '14 at 20:56
  • Yeah, regex is great for parsing HTML, but right now you're using the "string starts with" and "string ends with" so it's not matching. – adeneo Apr 18 '14 at 20:57
  • So would I have to just search for the string starts with expression? – jemiloii Apr 18 '14 at 21:11

1 Answers1

1

$(document) returns a jQuery object, not a string. You need to call html() to get the HTML contents of the document. You can do:

$('body').html(function(contents) {
    return contents.replace(/regexp/, 'replacement');
});

If you just want to see the match:

var match = $('body').html().match(/regexp/);
console.log(match);
Barmar
  • 741,623
  • 53
  • 500
  • 612
  • How would I been able to see what it returned? I need to be able to see the contents of the regexp found. Thanks! – jemiloii Apr 18 '14 at 21:06
  • That was the second thing I tried, which gave a TypeError: Cannot read property 'match' of undefined – jemiloii Apr 18 '14 at 21:20
  • Hmm, `$(document).html()` returns `null`. I changed to `$('body')`. – Barmar Apr 18 '14 at 21:23
  • Hmm, interesting. The only thing left that is needed is retrieving /^[~{.*?}~]$/, if I place the text node "regexp" and do a .match(/regexp/) it returns the text node "regexp". However, when I put in a more complex regexp, it simply returns null. – jemiloii Apr 18 '14 at 21:42
  • If it's returning null, there's nothing that matches the regexp you gave. Don't forget that `[` has special meaning in a regular expression, you have to escape it if you want it to be matched literally. – Barmar Apr 18 '14 at 21:45
  • Also, the `^` and `$` anchors match the beginning and end of the document. You don't want those in your regexp, since you want to match the templates anywhere in the document. – Barmar Apr 18 '14 at 21:46
  • So I'm trying this now: match = $('body').html().match(/\[~\{ .*? \}~\]/); console.log(match); i guess it doesn't like my expression, however when I go to http://regexpal.com/ it'll show the what I want to be found. I did take your advice and remove the ^$ – jemiloii Apr 18 '14 at 21:52
  • You still arent escaping the square brackets. Try: `/\[~\{.*?\}~\]/`. – Barmar Apr 18 '14 at 21:55
  • Maybe you did escape them, but I couldn't see it. Put code inside backticks to make it show up literally in the comment. – Barmar Apr 18 '14 at 21:56
  • Also, if the text inside the brackets can span multiple lines, you need the `s` modifier to allow `.` to match newlines. – Barmar Apr 18 '14 at 21:57
  • Oh wow, I totally had a fail, I didn't wait for the DOM to load. Once I placed the code within $(function(){ }) it worked, ish so far it only loaded the first expression – jemiloii Apr 18 '14 at 22:03
  • If you want it to match multiple times, you have to use the `g` modifier. Then it returns an array of all matches. – Barmar Apr 18 '14 at 22:04
  • ahh yes the g, aha, your amazing! thank you very much! – jemiloii Apr 18 '14 at 22:04
  • I have another question if your interested. http://stackoverflow.com/questions/23163396/is-it-possible-to-chain-jquery-regexp-matches – jemiloii Apr 18 '14 at 22:31