Hello!

For some reason I can not run the following regular program on js:

this.getText = function(){ var reg = /(?<=.menu{)[^}]*$/ let text1 = document.getElementById("css-mnu").innerText.search(reg); if (text1 == -1) return NaN; console.log(text1); let spl = text1.split(';'); return spl; }

The text itself:

  .header{ min-height: 25px; } .header *{ width: 100%; } .menu{ display: inline-flex; flex-direction: rows; justify-content: space-around; } .menu > *{ border: 1px solid; text-align: center; } .menu > *{ border: 1px solid; text-align: center; } .menu *:last-child{ display: none; }

Itself regular - working. Checked in notepad ++, finds no problem. Moreover, if we simplify the regular schedule itself, say to .menu, it also works.

 var func = function(){ var reg = /(?<=\.menu\{)[^\}]*$/ let text1 = document.getElementById("css-mnu").innerText.search(reg); if (text1 == -1) { document.write(text1); return NaN; } document.write(text1); let spl = text1.split(';'); return spl; } 
  <div style="border:1px solid;cursor:pointer" onclick=func() id="css-mnu"> /*все элементы меню имеют толщину 100%*/ .header{ min-height: 25px; } .header *{ width: 100%; } .menu{ display: inline-flex; flex-direction: rows; justify-content: space-around; } .menu > *{ border: 1px solid; text-align: center; } .menu > *{ border: 1px solid; text-align: center; } .menu *:last-child{ display: none; } </div>

What could be the problem with the full version /(?<=.menu{)[^}]*$/ ?) /(?<=.menu{)[^}]*$/ / /(?<=.menu{)[^}]*$/ ?

Thank you in advance

  • lookbehind doesn't work yet in js - ThisMan
  • You are looking for an element with css-mnu - maybe a typo here should be a css-menu - Evgeniy Nikolaev
  • @ThisMan, works, but not everywhere. - Grundy
  • 2
    Use exciting deception. document.getElementById("css-mnu").innerText.match(/\.menu{([^}]*)/)[1] - Wiktor Stribiżew
  • innerText best not to use. - Qwertiy ♦

1 answer 1

Use exciting backdisks, support for backward preview blocks ( (?<=...) ) appeared only in ECMAScript 2018:

 var m = document.getElementById("css-mnu").innerText.match(/\.menu{([^}]*)/); if (m) { return m[1].split(';'); } // else ...

Demo:

 var str = " .header{\n min-height: 25px; \n }\n .header *{\n width: 100%;\n }\n .menu{\n display: inline-flex; \n flex-direction: rows;\n justify-content: space-around; \n }\n .menu > *{\n border: 1px solid; \n text-align: center;\n }\n .menu > *{\n border: 1px solid; \n text-align: center;\n } \n .menu *:last-child{\n display: none;\n }"; var m = str.match(/\.menu{([^}]*)/); if (m) { console.log(m[1].trim().split(/\s*;\s*/).filter(Boolean)); }

Details

  • \. - symbol . (must be escaped to find only a character . )
  • menu{ - find menu{
  • ([^}]*) - An exciting submask (group) that finds 0 or more characters other than } ( [^}] is the exclusive character class) and places the found value in a separate memory buffer ( m[1] ).