javascript - 有人可以帮我理解这个例子中引号的位置吗？

Question

我是 javascript 新手，希望有人能够向我解释为什么某些引号会放在原来的位置。我在下面的代码中(我留下了注释)了解到，它是 3 个字符串组合成一个，但是我不明白为什么引号放在它们所在的位置。我确信答案是显而易见的，但我很难理解它。据我了解，这三个部分是 tag_opening +anchor_count + tag_looking。只是对单引号 ' ' 以及它们为何位于此处感到困惑。预先感谢您。

<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() {
            //I'm confused on the quotation placement and why it cannot look like this: 
            //"<li><a href='#bookmark" + cAnchorCount++' + ">" -OR- 
            //"<a name='bookmark" + cAnchorCount + >' + "</a>"
            $(this).html("<a name='bookmark" + cAnchorCount + "'></a>" + $(this).html());
            oList.append($("<li><a href='#bookmark" + cAnchorCount++ + "'>" + $(this).text() + "</a></li>"));
        });
        $("#" + sBookMarkNode).append(oList);
    }
</script>

Answer 1

这是因为要创建有效的标记，需要将属性值括起来，无论是单引号还是双引号。幸运的是，使用哪种类型并不重要，只要您在给定的字符串中保持一致(尽管至少尝试在所有代码中使用相同的方法)。

例如，这一行:

$("<li><a href='#bookmark" + cAnchorCount++ + "'>" + $(this).text() + "</a></li>")

将生成此标记:

<li><a href='#bookmarkSomeAnchorCount'>Some Text</a></li>

如果颠倒引号的使用，情况也是如此。这个新行:

$('<li><a href="#bookmark' + cAnchorCount++ + '">' + $(this).text() + '</a></li>')

将生成此标记:

<li><a href="#bookmarkSomeAnchorCount">Some Text</a></li>

本质上，一种引号类型用于描述字符串文字，而另一种是您想要包含在结果字符串中的字符，因为结果标记要求它有效。