Почему CDATA нужен и не работает везде одинаково?

Здесь есть несколько ошибок/проблем:

1. Добавление закрытого метода do() не сработало, поскольку do является зарезервированным словом!
   Этот код отлично работает как в FF, так и в Chrome (и в сценарии GM):

   var functionVar = (
       function test() {
           var a = 1;
           var properlyNamedVariable = function() {
               var b = 2;
           };
       }
   );
   console.log (functionVar.toString() );
   

   Если вы используете описательные имена переменных, вы не только избавите себя от многих проблем в будущем, вы почти никогда не будете случайно использовать зарезервированное слово.

2. Re: "To make this work in a Greasemonkey script, I have to put all code in a CDATA tag".

   Нет, этот код не работал. Ошибка произошла в области evald в песочнице Greasemonkey, и о ней не было сообщено в консоль ошибок Firefox. То есть он молча провалился.
   Если вы попытаетесь выполнить test(); из консоли, вы получите сообщение об ошибке: ReferenceError: test is not defined. Принимая во внимание, что если вы удалите код var do = function ... и перезагрузите страницу, вы можете вызвать test() из консоли.

3. Точно так же код script.textContent = (<><![CDATA[ ... также не работал. Он также молча провалился, и test() не был определен. Это немного другой вид скрытого сбоя, чем в предыдущем примере.

4. Код, основанный на трюке (<><![CDATA[ ..., не работает в Chrome, потому что Chrome не поддерживает встроенную обработку XML в javascript. Это преимущество Firefox, который поддерживает E4X, а Chrome — нет.

5. Пожалуйста, отформатируйте свой код, чтобы его не было такой рутиной при чтении.

Итак, в резюме:

1. Используйте описательные имена для переменных, функций и т. д.
2. Остерегайтесь зарезервированных слов в используемом вами языке.
3. Остерегайтесь тихих неудач. К сожалению, это происходит в различных сценариях Greasemonkey.
4. Разные браузеры поддерживают разные функции.

Вот метод, который работает в Firefox, Chrome, некоторых других браузерах, а также Greasemonkey, Tampermonkey, Scriptish и т. д. Он также помогает при отладке и тестировании, поскольку код отделен от встроенных объявлений переменных:

1. Определите свою функцию или обычный код:

   function testMyAdhocCode () {
       "use strict";    
       var importInteger   = 1;
       var imA_PrivateFunction = function () {
           var someOtherInteger = 2;
   
           console.log (
               "importInteger = ", importInteger,
               "  ||  someOtherInteger = ", someOtherInteger
           );
       };
   
       console.log ("Greetings from testMyAdhocCode()!");
       imA_PrivateFunction ();
   }
   

   
   

2. Затем вставьте его на страницу следующим образом (если необходимо. Лучше вообще не вводить код, если можете помочь.):

   addJS_Node (testMyAdhocCode);   //-- Function is just created.
   
   // OR
   addJS_Node (null, null, testMyAdhocCode); //-- Function is created and immediately run.
   
   // OR
   addJS_Node ("var someVar = 86;") //-- Adhoc code
   
   // OR
   addJS_Node ("preExistingFunction (42); ") //-- Run a preexisting function.
   

   
   

3. Где addJS_Node() включен в ваш скрипт как:

   function addJS_Node (text, s_URL, funcToRun, runOnLoad) {
       var D                                   = document;
       var scriptNode                          = D.createElement ('script');
       if (runOnLoad) {
           //--- Doesn't always fire on Chrome. Needs @run-at document-start.
           scriptNode.addEventListener ("load", runOnLoad, false);
       }
       scriptNode.type                         = "text/javascript";
       if (text)       scriptNode.textContent  = text;
       if (s_URL)      scriptNode.src          = s_URL;
       if (funcToRun)  scriptNode.textContent  = '(' + funcToRun.toString() + ')()';
   
       var targ = D.getElementsByTagName ('head')[0] || D.body || D.documentElement;
       targ.appendChild (scriptNode);
   }
   

Обновление для дополнительного вопроса:

Новая проблема больше похожа на другую.

• Это неправильный код, поэтому он выдает ошибку в консоли Firefox.
• Он использует функцию E4X, поэтому не будет работать в Chrome.
• Он должен выдать ту же ошибку в Greasemonkey, что и в Firefox (номинально это один и тот же движок JS), но из-за чистой удачи в том, как GM изолирует скрипты, вам сойдет с рук это ошибочный код (пока что).
• Не кодируйте таким образом! Используйте такую ​​функцию, как addJS_Node().

Если вам действительно нужно внедрить код, правильный способ сделать это так:

function main () {
    "use strict";   // Keep this line!
    var aClass = new aClass();

    function aClass() {
        var a = 1;
        var aPrivateMethod = function() {
            var b = 2;
            alert(b);
        };
        this.aPublicMethod = function() {
            var c = 3;
            alert(c);
        };
    }

    aClass.aPublicMethod();

    //-- PUT ALL OF THE REST OF YOUR INJECTED CODE HERE.
}

addJS_Node (null, null, main);

Плохая идея помещать все в глобальную область действия целевой страницы! Но если вы настаиваете на этом, код выглядит так:

function aClass() {
    "use strict";   // Keep this line!
    var a = 1;
    var aPrivateMethod = function() {
        var b = 2;
        alert(b);
    };
    this.aPublicMethod = function() {
        var c = 3;
        alert(c);
    };
}

addJS_Node (aClass);
addJS_Node (
      'var aClass = new aClass();'
    + 'aClass.aPublicMethod();'
);

Все права на @BrockAdams Почему CDATA нужен и не работает везде одинаково? за идею написать все в функцию и вставить содержимое в тег script, спасибо.

Благодаря @polygenelubricants javascript get function body за получение содержимого функции main() только, а не функцию с ее содержанием.

var script = document.createElement("script");
function main()
{
var aClass = new AClass();
function AClass()
{
    var a = 1;
    var aPrivateMethod = function() {
        var b = 2;
        alert(b);
    };
    this.aPublicMethod = function() {
        var c = 3;
        alert(c);
    };
}
aClass.aPublicMethod();
}
var entire = main.toString();
var body = entire.substring(entire.indexOf("{") + 2, entire.lastIndexOf("}"));
script.textContent = body;
document.getElementsByTagName("head")[0].appendChild(script);

«+2» после entire.indexOf("{") нужен для того, чтобы не выбирать символ «{» и не иметь пустой новой строки в начале содержимого тега скрипта.

Функция класса Javascript не должна иметь то же имя, что и переменная, в которой мы сохраняем экземпляр класса, в Firefox aClass.aPublicMethod(); будет вызываться автоматически только при первом выполнении кода (вы не можете переопределить функцию класса), Chrome все равно обозначения, это работает.

Итак, я выбрал AClass для имени класса и aClass для объекта класса.

Любопытно, что кажется, что Firefox анализирует/отображает функцию так, как ему нравится, когда мы используем метод .toString(), например, когда скрипт вставлен, его содержимое в Firefox Inspector будет отображаться только в одной строке. Firebug отформатирует код с пробелом «табуляция» перед каждой новой строкой, даже если мы удалим пробелы при вставке функции main() (из-за того, что Firebug знает, что функция main() была перед подстрокой, поэтому он добавляет авто-пробел ). Firebug также добавляет новую строку до и после функции AClass(); когда возвращаемое значение функции сохраняется в переменной, такой как aPrivateMethod или aPublicMethod, оно отображается в 1 строке. Еще одно странное изменение Firebug заключается в том, что var aClass = new AClass(); становится var aClass = new AClass;.

function AClass()
{
    // code
}

становится

function AClass() {
    // code
}

и так далее...

Консоль Chrome всегда учитывает пробелы/новые строки, как вы написали в функции main().

Я думаю, что это то, как была создана консоль отладки, и это не имеет значения. Кстати, все эти модификации, о которых я говорил, не появляются в Firebug при использовании расширения E4X.

Забавно видеть разницу при использовании метода function.toString() вместо расширения E4X. Может у кого есть объяснение :)

Результат консоли Firefox с методом function.toString():

var aClass = new AClass; function AClass() { var a = 1; var aPrivateMethod = function () {var b = 2;alert(b);}; this.aPublicMethod = function () {var c = 34;alert(c);}; } aClass.aPublicMethod();

Результат консоли Firefox с расширением E4X:

var aClass = new AClass(); function AClass() { var a = 1; var aPrivateMethod = function () { var b = 2; alert(b); }; this.aPublicMethod = function () { var c = 34; alert(c); }; } aClass.aPublicMethod();

Результат Firebug с методом function.toString():

    var aClass = new AClass;

    function AClass() {
        var a = 1;
        var aPrivateMethod = function () {var b = 2;alert(b);};
        this.aPublicMethod = function () {var c = 3;alert(c);};
    }

    aClass.aPublicMethod();

Результат Firebug с расширением E4X и результат консоли Chrome с методом function.toString() (E4X не поддерживается) одинаковы:

var aClass = new aClass();
function aClass() {
    var a = 1;
    var aPrivateMethod = function() {
        var b = 2;
        alert(b);
    };
    this.aPublicMethod = function() {
        var c = 3;
        alert(c);
    };
}
aClass.aPublicMethod();

Может быть связано, E4X - это чистый способ сделать это без взлома подстроки, но поддерживается только Firefox: Создание многострочных строк в JavaScript