javascript regex for filename in import script (js/css)

Question

i have a string containing some HTML code:

var myString = '<html> ... <script src="/cmn/libs/js/myJavascriptFile.js"></script> 
<link rel="stylesheet" href="../assets/myCssFile.css"/> ... </html>';

and i want to match all the imported files without the PATH, like this: myJavascriptFile.js , myCssFile.css

i tried with this regex

var myRegexp = /src="(.*)"|href="(.*)"/g;
var match = myRegexp.exec(myString);

but it gives me the entire path, and i guess it will fail if import has single quote. What's the best approach here? thanks

this is the test i did: https://regex101.com/r/gL8lO7/2

Answer 1

 var html = document.getElementById("data").value; var res = []; html.replace(/(?:src|href)=(["'])(?:.*?)([^\\\\/"]*?)\\1/g, function (match, quote, name) { res.push(name); }) console.log(res);

 textarea { display: block; width: 100%; }

 <textarea id=data><html> ... <script src="/cmn/libs/js/myJavascriptFile.js"></script> <link rel="stylesheet" href='../assets/myCssFile.css'/> ... </html></textarea>

Answer 2

You can use following regex.

(?:src|href)=("|').*?([\w.]+\.(?:js|css))\1

RegEx101 Demo

RegEx Explanation:

(?:src|href)= : Match src= or href=
("|') : Match single quote ' or double quote " and add this into first captured group.
.*? : Match any characters lazily to satisfy condition
([\\w.]+\\.(?:js|css)) : Second captured group
1. [\\w.]+\\. : Match any alphanumeric character and underscore one or more times followed by dot.
2. (?:js|css) : Match js or css .
\\1 : Back-reference to first captured group. Match the same thing in the first captured group. ie single or double quote.

Demo:

 var str = '<script src="\\/cmn\\/libs\\/js\\/myJavascriptFile.js"><\\/script><link rel="stylesheet" href="..\\/assets\\/myCssFile.css" \\/><script src=\\'\\/cmn\\/libs\\/js\\/myJavascriptFile.min.js\\'><\\/script><link rel="stylesheet" href=\\'0..\\/assets\\/myCssFile.css\\'\\/>'; var allFiles = []; var regex = /(?:src|href)=("|').*?([\\w.]+\\.(?:js|css))\\1/gi; var fileName = ''; while(fileName = regex.exec(str)) { allFiles.push(fileName[2]); } console.log(allFiles);

javascript regex for filename in import script (js/css)

Question

2 answers

solution1
2 2016-06-06 11:21:55

solution2
1 ACCPTED 2016-06-06 15:20:26

javascript regex for filename in import script (js/css)

Question

2 answers

solution1 2 2016-06-06 11:21:55

solution2 1 ACCPTED 2016-06-06 15:20:26

solution1
2 2016-06-06 11:21:55

solution2
1 ACCPTED 2016-06-06 15:20:26