有人可以解释为什么在 HTML 标记中关闭引号之前需要一个“+”吗？

【问题标题】：Can someone explain why a "+" is needed before closing quotes in an HTML tag?有人可以解释为什么在 HTML 标记中关闭引号之前需要一个“+”吗？
【发布时间】：2014-05-12 19:54:20
【问题描述】：

我对 Javascript 很陌生，这是我在学习 JQuery 课程时第一次遇到这种类型的连接。我的问题是关于 + 号以及为什么需要在 ">" 之前加上所有引号来关闭 HTML 标记。换句话说，代码的 + "'> " 部分。为什么你不能只结束引号并关闭没有加号的标签？有人可以逐步分解吗？我在脚本中留下了我感到困惑的评论。有2个实例。谢谢。

<script type="text/javascript">

    $("document").ready(function() {    
        buildBookmarks('h3', 'header'); 
    }); 

    function buildBookmarks(strWhichTag, sBookMarkNode) {

        var cAnchorCount = 0;

        var oList = $("<ul id='bookmarksList'>");

        $("div:not([id=header]) " + strWhichTag).each(function() { //This is the part 
            $(this).html("<a name='bookmark" + cAnchorCount + "'></a>" + $(this).html());       
            oList.append($("<li><a href='#bookmark" + cAnchorCount++ + "'> " + $(this).text() + "</a></li>"));
        });

        $("#" + sBookMarkNode).append(oList);
    }
</script>

【问题讨论】：

因为...字符串连接？
很有趣，Stack Overflow 的语法高亮可以帮助你理解这一点。

标签： javascript jquery html variables string-concatenation

【解决方案1】：

你已经结束了字符串文字，回到这里：

"<li><a href='#bookmark"
//                     ^ here

现在您将一个表达式连接到它之前的字符串，并将该连接的结果与另一个字符串文字连接，然后使用 + 运算符完成连接。

如果我们用代表表达式的占位符（它们是）替换文字，并添加括号，它可能会变得更清晰：

oList.append($(A + (cAnchorCount++) + B + ($(this).text()) + C));

请注意，这里的 HTML 没有任何特殊之处；你这里的字符串和其他字符串一样。它们恰好代表 HTML。（顺便说一下，我建议在 jQuery 之前学习 W3C DOM；它使这种分离更加清晰。）

【讨论】：

谢谢。我想我对引用位置以及为什么它不能看起来像这样感到困惑： "
" -OR- " + ""

谢谢！我无法理解单引号 ' 实际上是字符串本身的一部分！我现在明白了。

【解决方案2】：

该脚本通过将字符串连接在一起，在 Javascript 中构建一个 HTML 元素。你可以这样想：

tag_opening + anchor_count + tag_closing

+ 是必要的，因为它将字符串添加在一起。没有它，你只会跟着一个字符串跟另一个，这会导致语法错误。

【讨论】：

谢谢，我明白了，现在它是 3 件。我想我对引用位置以及为什么它不能看起来像这样感到困惑："
"

为什么是++？第二个' 需要进入""，因为它关闭了标签内的href 属性值。

【解决方案3】：

这里的加号用于连接。你真正要做的是添加一个你写的字符串（一个名字='书签）加上一个变量（cAnchorCount），再加上另一个字符串（'>）来组成一个长字符串。没有加号，语法就没有意义。

【讨论】：

【解决方案4】：

您的示例不清楚，但您将变量与 HTML 字符串组合在一起：

"<a href='#bookmark" + cAnchorCount++ + "'> "

将评估为：

<a href='#bookmark1'>

您列出的代码使用外部双引号 (") 来包装字符串和内部单引号 (') 来包装属性值。 JavaScript 字符串中没有插值，只有字符串连接。

【讨论】：

【解决方案5】：

他们正在尝试格式化一个字符串，以便一旦代码编译，它将是可读的 HTML。

例如：

oList.append($("<li><a href='#bookmark" + cAnchorCount++ + "'> " + $(this).text() + "</a></li>")); 试图最终得到

<li><a href='#bookmark3'>TEXT</a></li>

添加文本后，您需要'> 从<a href=' 正确关闭标签。

【讨论】：

【解决方案6】：

在这种情况下，它与 HTML 或被连接的字符串的内容无关，只是 JavaScript 使用 + 运算符来连接字符串。我想每种语言都使用 some 运算符来做到这一点。例如：

var result = 'first string' + 'second string';

这将创建连接的字符串：

'first stringsecond string'

现在，如果其中一个字符串恰好是变量，也会发生同样的事情：

var someVariable = 'second string';
var result = 'first string' + someVariable;

这仍然会导致相同的连接字符串：

'first stringsecond string'

这就是问题中的所有代码在这些情况下所做的。将一个字符串连接到另一个字符串。例如：

$("div:not([id=header]) " + strWhichTag)

变量strWhichTag 包含一些字符串值，根据名称和用法判断，可能是HTML 标记的名称。因此，如果它包含类似'div' 的内容，那么结果是：

$("div:not([id=header]) div")

然后，jQuery 将评估这个整体结果字符串作为选择器来识别要操作的一组 HTML 元素。但是字符串连接并不重要，它可以很容易地导致：

$("div:not([id=header]) some nonsense")

如果strWhichTag 变量包含值'some nonsense'。

【讨论】：

【解决方案7】：

这称为连接，# 是字符串的 ID，而 sBookMarkNode 是变量。然后，当页面加载时，它将在 # + sBookMarkNode 之后附加（创建）变量 sBookMarkNode 显然是在其他地方创建的，或者是全局变量，因为我在您的代码 sn-p 中看不到它。

【讨论】：