Question

在javascript中我正在创建一个li元素，如下所示，它只包含我看到的问题。

data-videoUrl显示完整的网址，所以那里都很好。

问题是entry.link和entry.title，在调试时，我验证了字符串在引号内。即＆＃34;这是一个播客。＆＃34;但是data-videoTitle和data-videoDesciption正在被截断。即＆＃34;这＆＃34;将从前一个例子中显示。

我不确定后两个数据分配中发生了什么，因为我已经验证了文本不是双引号等等.Html5数据元素出现了什么？如果需要，我可以提供更完整的例子。

      var podItem = document.createElement("li");
      podItem.innerHTML = entry.title
      + "<a data-videoUrl=" + entry.link + " "
      + "data-videoTitle=" + entry.title + " "
      + "data-videoDescription=" + entry.contentSnippet + " "
      + "</a>";
      document.getElementById("podCastList").innerHTML += podItem.innerHTML;

这是一个正在生成的html。

 <a data-videourl="http://rss.cnn.com/~r/services/podcasting/studentnews/rss/~3/d3y4Nh_yiZQ/orig-sn-060614.cnn.m4v" data-videotitle="CNN" student="" news="" -="" june="" 6,="" 2014="" data-videodescription="For" our="" last="" show="" of="" the="" 2013-2014="" school="" year,="" cnn="" takes="" a="" look="" back,="" ahead,="" and="" at="" stories="" making="" ...="" <=""></a>

我确定我还没有完全理解。为什么第一个数据元素会正确地获取文本，接下来的两个数据元素会分解文本，如下所示：[data-videotitle =＆＃34; CNN＆＃34;学生=＆＃34;＆＃34;新闻=＃34＆;＆＃34]。该文是引用的直接句子，即CNN学生新闻......＆＃34;

为什么videoUrl正常工作而另外两个不正常？

Answer 1

您需要在属性周围添加一些引号...

  podItem.innerHTML = entry.title
  + "<a data-videoUrl=\"" + entry.link + "\" "
  + "data-videoTitle=\"" + entry.title + "\" "
  + "data-videoDescription=\"" + entry.contentSnippet + "\" "
  + "</a>";

您还需要确保转义属性中的任何引号。

创建li元素并将文本分配给data-attribute的Javascript正在被截断

1 个答案: