javascript - SyntaxError: expected expression, got '.' - Stack Overflow

admin管理员组

文章数量:1324856

Does someone know where this JavaScript error es from?

SyntaxError: expected expression, got '.'

I get this error when using a regular expression with a slash (escaped) like el.href.match(/video\/(.*)@/)[1]; as a string passed to a function like createTextNode, textContent or innerHTML.

This regex works when not stored as text. A regex without slash as text works, you can see my code example:

HTML:

<a style="display: none; width: 840px; height: 472px;" href="@Info-web" id="catchup" class="video"></a>

JavaScript:

var el = document.getElementById("catchup");
var script = document.createElement("script");
var text = `
    (function() {
        var id = el.href.match(/video\/(.*)@/)[1];
        alert("test 4 - regex with slash as text: " + id);
    })();`; 
script.appendChild(document.createTextNode(text));      
document.getElementsByTagName("head")[0].appendChild(script);

Working and failing tests can be found here:

.github.io/blob/65f11b77df5a7464365374b3505921a4ef9b1272/get_m3u8_debug/get_m3u8_debug.htm

You can test it live on GitHub Pages (JSFiddle did not work in my case):

.htm

Does someone know where this JavaScript error es from?

SyntaxError: expected expression, got '.'

I get this error when using a regular expression with a slash (escaped) like el.href.match(/video\/(.*)@/)[1]; as a string passed to a function like createTextNode, textContent or innerHTML.

This regex works when not stored as text. A regex without slash as text works, you can see my code example:

HTML:

<a style="display: none; width: 840px; height: 472px;" href="http://videos.francetv.fr/video/147338657@Info-web" id="catchup" class="video"></a>

JavaScript:

var el = document.getElementById("catchup");
var script = document.createElement("script");
var text = `
    (function() {
        var id = el.href.match(/video\/(.*)@/)[1];
        alert("test 4 - regex with slash as text: " + id);
    })();`; 
script.appendChild(document.createTextNode(text));      
document.getElementsByTagName("head")[0].appendChild(script);

Working and failing tests can be found here:

https://github./baptx/baptx.github.io/blob/65f11b77df5a7464365374b3505921a4ef9b1272/get_m3u8_debug/get_m3u8_debug.htm

You can test it live on GitHub Pages (JSFiddle did not work in my case):

https://baptx.github.io/get_m3u8_debug/get_m3u8_debug.htm

• javascript
• regex
• syntax-error
• textnode
• createtextnode

Share Improve this question Follow edited Oct 22, 2016 at 12:50 baptx asked Oct 22, 2016 at 11:23 baptxbaptx 3,91666 gold badges3838 silver badges4444 bronze badges 2

• you should have passed the relevant code directly to the question (in case you delete the repo) and the correct link should point to a particular version, not to the master branch - https://github./baptx/baptx.github.io/blob/65f11b77df5a7464365374b3505921a4ef9b1272/get_m3u8_debug/get_m3u8_debug.htm – Aprillion Commented Oct 22, 2016 at 11:42
• @Aprillion Thanks, I thought about adding the code on StackOverflow but I wanted people to see all the working cases also. Usually I will not delete the repo but I had the idea to backup the link on the Wayback Machine web.archive/web/20161022102615/https://baptx.github.io/… Good point for the particular version in case I want to fix the error there. – baptx Commented Oct 22, 2016 at 12:15

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

You are escaping the forward slash instead of having a baskward slash.

`el.href.match(/video\/(.*)@/)[1]` === 'el.href.match(/video/(.*)@/)[1]'
// '\/' == '/', not '\\/'

You need to escape the backward slash as well:

`el.href.match(/video\\/(.*)@/)[1]`

You can also take advantage of the template string with the string representation of a regex to get it's source code representation. Basically, eval(/any regex/ + '') will get the same regex.

var regex = /video\/(.*)@/;
var text = `el.href.match(${regex})[1]`;
// Or:
var text = `el.href.match(` + /video\/(.*)@/ + ')[1]';

/video\/(.*)@/igm + '' === '/video\\/(.*)@/gim';
new RegExp('video\\/(.*)@', 'gmi') + '' === '/video\\/(.*)@/gim';

If by "as a string" you mean "video\/(.*)@", then the backslash itself needs to be escaped, "\\" is a string literal containing one backslash:

/video\/(.*)@/

is the same as

new Regex("video\\/(.*)@")

You're using template literals with literal strings as regular expressions, and you have to double-escape the slashes, or any other special character, in those regular expressions.

Javascript interprets and removes the first escape character when parsing the string literal, and you need the escape character to make it into the script, so you'll need two of them.

var text = `
        (function() {
            var id = el.href.match(/video\\/(.*)@/)[1];
            alert("test 4 - regex with slash as text: " + id);
        })();`;

本文标签： javascriptSyntaxError expected expressiongot 3939Stack Overflow