You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

使用PHP echo输出JS代码时出现SyntaxError: unexpected token: identifier错误

问题根源与修复方案

你猜的完全正确!这个语法错误确实是单双引号嵌套未正确处理导致的。咱们来拆解问题,再给出几种靠谱的修复方式:

问题分析

你的PHP代码用单引号包裹整个<script>字符串,而里面的JS代码又用双引号定义innerHTML的HTML内容——HTML属性里的双引号(class="hello")会直接闭合JS的字符串,浏览器解析时就会抛出SyntaxError,因为它以为字符串提前结束了,后面的内容就成了无效标识符。


修复方案1:转义JS中的双引号

在JS的innerHTML里,把HTML属性的双引号前面加上反斜杠转义,这样浏览器就会把它当作字符串的一部分,而不是结束符号:

if ($var == 0) {
    echo '<script>console.log("Test."); var res = document.getElementById("response"); res.innerHTML = "<div class=\"hello\">hi</div>";</script>';
}

(注:PHP的单引号字符串里,不需要转义双引号,所以直接在JS层面转义就行)

修复方案2:换用单引号包裹HTML属性

把HTML的class="hello"改成class='hello',这样和JS的双引号字符串就不会冲突,代码更清爽:

if ($var == 0) {
    echo '<script>console.log("Test."); var res = document.getElementById("response"); res.innerHTML = "<div class=\'hello\'>hi</div>";</script>';
}

(这里PHP里的单引号要转义成\',因为外层是单引号包裹的字符串)

修复方案3:用PHP Heredoc语法(推荐)

如果代码行数多或者嵌套复杂,Heredoc可以彻底避免引号嵌套的烦恼,代码可读性大幅提升:

if ($var == 0) {
    echo <<<JS_BLOCK
<script>
console.log("Test.");
var res = document.getElementById("response");
res.innerHTML = "<div class='hello'>hi</div>";
</script>
JS_BLOCK;
}

只要保证结束标记JS_BLOCK;单独占一行,且前后没有空格就行。


额外优化建议:直接用PHP输出HTML(更高效)

如果你的场景允许,其实可以跳过JS,直接用PHP在页面的目标位置输出div,这样既避免了JS解析问题,也更高效:

<?php if ($var == 0): ?>
    <div class="hello">hi</div>
<?php endif; ?>

把这段代码直接放在#response容器内部即可,不需要额外的JS操作。

内容的提问来源于stack exchange,提问作者ashawe

火山引擎 最新活动