js: 请用5个双引号解释这个变量值

Question

请简要看一下下面的代码：

<script type="text/javascript">
function recentpostslist(json) {
 document.write('<ul class="recommended">');
 var i;
 var j;
 for (i = 0; i < json.feed.entry.length; i++)
 {
  for (j = 0; j < json.feed.entry[i].link.length; j++) {
   if (json.feed.entry[i].link[j].rel == 'alternate') {
    break;
   }
  }
var postUrl = "'" + json.feed.entry[i].link[j].href + "'";//bs
var postTitle = json.feed.entry[i].title.$t;
var item = "<li>" + "<a href="+ postUrl + '" target="_blank">' + postTitle + "</a> </li>";
 document.write(item);
 }
 document.write('</ul>');
 }
</script>
<script src="https://xxxxxxxxxx.blogspot.com/feeds/posts/summary/-/recommended?max-results=3&alt=json-in-script&callback=recentpostslist"></script>

背景资料

我昨天发现了这个somewhere on the Internet，从那以后一直在尝试修改它。

变量 i 和 j 最初是在 for 循环中声明的，如...

for (var i = 0; i < json.feed.entry.length; i++)
{
 for (var j = 0; j < json.feed.entry[i].link.length; j++) {
  if (json.feed.entry[i].link[j].rel == 'alternate') {
   break;
  }
 }

...

...但是在 w3schools.com 上做了一些（初学者）阅读后，我得到的印象是他们建议将变量声明保留在 for 循环之外。我的编程水平很差，处于最佳状态，所以说实话，我不知道我的印象是否正确。

然后我在开头（第3行）给<ul>元素分配了一个class。

到目前为止，还不错。我检查了一下，脚本仍然有效。

它的作用是列出已标记为 "recommended".

的博客的 3 个最新帖子的标题。

然后我尝试将 class 分配给 <li> 元素，该元素被声明为...嗯... 值的一部分 （我理解对了吗？）第 15 行的 item 变量：

var item = "<li>" + "<a href="+ postUrl + '" target="_blank">' + postTitle + "</a> </li>";

但这似乎使代码无效，这并不奇怪，真的，因为它看起来确实有点遥不可及。

我的问题

然而，当仔细查看这行代码时，我必须说我对所有引号（单引号和双引号）感到非常困惑。

如果有人能解释一下，将不胜感激
"<a href="+ postUrl + '" target="_blank">'
为什么一共有5个双引号？有错吗？
'" target="_blank">'有什么作用？

Answer 1

它只是使用单引号来避免必须转义 double-quoted 字符串中的文字双引号。

'" target="_blank"'

对

"\"target=\"_blank\""

由于 postUrl 的定义包含属性的引号，因此 item 的定义中有一个额外的双引号。但是，我建议不要将这些引号 postUrl，因为引号不是 URL 的部分。

如果这样做，该行前面的双引号会丢失。你有

var item = "<li>" + "<a href=" + postUrl + '" target="_blank">' + postTitle + "</a> </li>";

你应该

var item = "<li>" + '<a href="' + postUrl + '" target="_blank">' + postTitle + "</a> </li>";
                  # ^^^^^^^^^^^
                  # Include a literal " after the =,

（否则，target 之前的引用将是多余的，需要删除。）

这条线会更清晰一点，因为

var item = '<li> <a href="'+ postUrl + '" target="_blank">' + postTitle + "</a> </li>";

你可以责怪 JavaScript 没有 built-in 方便的方法将值插入字符串。（不过，请参阅 How can I do string interpolation in JavaScript?，这表明已添加此内容。请注意，我不是 Javascript 程序员。

var item = `<li> <a href="${postUrl}" target="_blank">${postTitle}</a> </li>`;

)

Answer 2

原版有三个"，这意味着一个永远不会关闭，所以它不起作用。正确的应该是

" target='_blank'"

经文

'" target="_blank"'

在 javascript 中，有几种创建字符串的方法，两种方法是 ' ' 单刻度和 " " 双刻度。

每次开始打勾 (", ') 时，在相应的结束打勾 (", ') 之前，其中的所有内容都是一个字符串，因此如果您需要在字符串中包含一个字符串，您可以通过执行以下操作来完成此操作双刻度内的单刻度或单刻度内的双刻度。运行这在 Web 控制台中

console.log("hey 'yes'");
console.log('hey "yes"');

经文

    console.log("hey "yes"");
    console.log('hey 'yes'');

最后一个 to 会出错，因为你现在说的是字符串 hey，然后是变量 yes 并关闭空字符串

Answer 3

您正在使用 JS 创建字符串 <a href="some-url.html" target="_blank">

所有引号都是必需的，因为您在 JS 中使用引号来定义 string literal，而且还在字符串本身中输出引号 - 因此，在双引号周围使用单引号。 '"' 在 JS 中创建字符串 ".

target="_blank" 是一个 HTML 属性，表示打开超链接的目标 window 应该被称为 _blank，又名 a new window。

Answer 4

好的，所以这一行有一个乱七八糟的引号。

var item = "<li>" + "<a href="+ postUrl + '" target="_blank">' + postTitle + "</a> </li>";

试试这个：

var item = "<li>" + "<a href="+ postUrl + " target='_blank'>" + postTitle + "</a></li>";

问题出在 postUrl + 之后的单引号... 您已经正确地转义了 URL 因此不需要在 postUrl.

周围添加额外的引号

试试吧！

Answer 5

"<a href="+ postUrl + '" target="_blank">' 作为一个整体语句用于通过从提要 json 中读取 postUrl 动态构建锚标记 <a>，然后附加此 <a> 标记到您的 html.

前两个 " 引号用于定义包含 <a> 标记的第一段的字符串文字，而最后两个 " 用于包含 " 的值target 属性将显示在最后一个 HTML 上，中间的那个（按顺序第 3 个）用于在 HTML 上查看时关闭 href 属性.

这样渲染的 HTML 将如下所示：

<a href="http://the_postUrl_value_from_feed" target="_blank">

顺便说一句，您使用的语句是错误的，缺少 href 属性的起始 " 引号，请尝试将其更新为如下内容：

'<a href="' + postUrl + '" target="_blank">'

Answer 6

为了回答您的问题，我必须解释一下有关字符串变量的内容。让我们看一下您填充 var 项的代码：

var item = "<li>" + "<a href="+ postUrl + '" target="_blank">' + postTitle + "</a> </li>";

此处您要创建一个字符串变量，因此引号（双引号或单引号）必须作为字符串的开头和结尾，并且必须相同，如下所示：

var myVar = "My content";

按照代码，你有一个变量将被放入另一个变量中，所以你必须打开引号，放入你的字符串，然后关闭你的引号，将 + sinal 连接到字符串并完成（或放入另一个+ 与另一个 string/var) 连接。示例：

var myAge = "23";
var myConcatVar = "I am " + myAge + " years old";

这是基础，关于 concat 和 string。

但是您正在创建一个 HTML 字符串，并且 HTML 代码使用引号。所以，是的，您必须使用所有引号（双引号和单引号）。

现在关于您的代码：

如你所想，你必须以双引号或单引号开始一个字符串，但你必须在连接时保留这个引号。在 var 项目中，您以双引号开头，但使用单引号与 postUrl var 连接。您的代码如下所示：

var item = "<li>" + "<a href="+ postUrl + '" target="_blank">' + postTitle + "</a> </li>";

当他一定是这样的时候：

var item = "<li>" + "<a href='"+ postUrl + "' target='_blank'>" + postTitle + "</a></li>";

然后当你打印这个变量时，结果会是这样的：

<li><a href='postUrl content' target='_blank'></a></li>

正如你在结果中看到的，你必须使用单引号和双引号，因为属性 href 和 target 也使用引号。关于 target="_blank"，它将在新选项卡中发送 url。

抱歉我的英语不好哈哈，希望这对您有所帮助。

js: 请用5个双引号解释这个变量值

js: please explain this variable value with 5 double quotations

html

javascript

json

blogger

addition

背景资料

我的问题