Javascript jQuery + 客户端模板 = "语法错误，无法识别的表达式"
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14347611/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery + client-side template = "Syntax error, unrecognized expression"
提问by Evgeny
I just updated jQuery from 1.8.3 to 1.9, and it started crashing all of a sudden.
我刚刚将 jQuery 从 1.8.3 更新到 1.9，它突然开始崩溃。
This is my template:
这是我的模板：
<script type="text/template" id="modal_template">
<div>hello</div>
</script>
This is how I read it:
我是这样读的：
modal_template_html = $("#modal_template").html();
This is how I transform it into jQuery object (I need to use jQuery methods on it):
这就是我将它转换为 jQuery 对象的方式（我需要在其上使用 jQuery 方法）：
template = $(modal_template_html);
... and jQuery crashes!
... jQuery 崩溃了！
Error: Syntax error, unrecognized expression: <div>hello</div>
错误：语法错误，无法识别的表达式：<div>hello</div>
slice.call( docElem.childNodes, 0 )[0].nodeType;
slice.call( docElem.childNodes, 0 )[0].nodeType;
jquery-1.9.0.js (line 3811)
jquery-1.9.0.js（第 3811 行）
However, if I declare template as a plain text variable, it starts working again:
但是，如果我将模板声明为纯文本变量，它会再次开始工作：
var modal_template_html = '<div>hello</div>';
Can anyone help me to figure this out?
谁能帮我解决这个问题？
UPDATE: Jquery team heard and changedthings back to normal in 1.10:
UPDATE：jQuery开发团队听取和改变一切恢复正常1.10：
The biggest change you're likely to see is that we've loosened up the criteria for HTML processing in $(), allowing leading spaces and newlines as we did before version 1.9
您可能会看到的最大变化是我们放宽了 $() 中 HTML 处理的标准，允许前导空格和换行符，就像我们在 1.9 版本之前所做的那样
回答by Evgeny
Turns out string starting with a newline (or anything other than "<") is not considered HTML string in jQuery 1.9
原来以换行符（或除“<”以外的任何内容）开头的字符串在 jQuery 1.9 中不被视为 HTML 字符串
http://stage.jquery.com/upgrade-guide/1.9/#jquery-htmlstring-versus-jquery-selectorstring
http://stage.jquery.com/upgrade-guide/1.9/#jquery-htmlstring-versus-jquery-selectorstring
回答by Charles
I guess your template is starting with a space or a tab.
我猜您的模板以空格或制表符开头。
You can use jQuery like that:
你可以像这样使用jQuery：
$($.parseHtml(modal_template_html)[1]);
or parse the string to remove spaces of the beginning:
或解析字符串以删除开头的空格：
$(modal_template_html.replace(/^[ \t]+/gm, ''));
回答by Kevin C.
EugeneXa mentioned it in a comment, but it deserves to be an answer:
EugeneXa 在评论中提到了它，但它值得作为一个答案：
var template = $("#modal_template").html().trim();
This trims the offending whitespace from the beginning of the string. I used it with Mustache, like so:
这会从字符串的开头修剪有问题的空格。我将它与 Mustache 一起使用，如下所示：
var markup = Mustache.render(template, data);
$(markup).appendTo(container);
回答by Eran H.
You can use
您可以使用
var modal_template_html = $.trim($('#modal_template').html());
var template = $(modal_template_html);
回答by voya
As the official document: As of 1.9, a string is only considered to be HTML if it starts with a less-than ("<") character. The Migrate plugin can be used to restore the pre-1.9 behavior.
作为官方文档：从 1.9 开始，只有以小于 ("<") 字符开头的字符串才被认为是 HTML。Migrate 插件可用于恢复 1.9 之前的行为。
If a string is known to be HTML but may start with arbitrary text that is not an HTML tag, pass it to jQuery.parseHTML() which will return an array of DOM nodes representing the markup. A jQuery collection can be created from this, for example: $($.parseHTML(htmlString)). This would be considered best practice when processing HTML templates for example. Simple uses of literal strings such as $("<p>Testing</p>").appendTo("body")are unaffected by this change.
如果已知字符串是 HTML，但可能以不是 HTML 标记的任意文本开头，请将其传递给 jQuery.parseHTML()，它将返回表示标记的 DOM 节点数组。这个jQuery集合从这里可以创建，例如：$($.parseHTML(htmlString))。例如，在处理 HTML 模板时，这将被视为最佳实践。诸如此类的文字字符串的简单使用$("<p>Testing</p>").appendTo("body")不受此更改的影响。
回答by Rivki Aizen
I had the same error:
"Syntax error, unrecognized expression: // "
It is known bug at JQuery, so i needed to think on workaround solution,
What I did is:
I changed "script" tag to "div"
and added at angular this code
and the error is gone...
我有同样的错误：
“语法错误，无法识别的表达式：//”
这是 JQuery 的已知错误，所以我需要考虑解决方法，
我所做的是：
我将“脚本”标签更改为“div”
并添加到角度这个代码
和错误消失了......
app.run(['$templateCache', function($templateCache) {
var url = "survey-input.html";
content = angular.element(document.getElementById(url)).html()
$templateCache.put(url, content);
}]);
