Question

我正在使用此代码在Blogger中使用带有JavaScript的按字母顺序排列的无序列表。这适用于CodePen和JSFiddle，但是当我在Blogger中使用它时，保存后我收到此错误：Error parsing XML, line 1007, column 3: The element type "li" must be terminated by the matching end-tag "".。它指的是这一行：$this.before('<li class="splitter">' + firstLetter);。如何解决这个问题？

var list = $('ul'),
    items = $('li', list);

// sort the list
var sortedItems = items.get().sort(function(a, b) {
  var aText = $.trim($(a).text().toUpperCase()),
      bText = $.trim($(b).text().toUpperCase());
  
   return aText.localeCompare(bText);
});

list.append(sortedItems); 

// create the titles
var lastLetter = '';
list.find('li').each(function() {
  var $this = $(this),
      text = $.trim($this.text()),
      firstLetter = text[0];

  if (firstLetter != lastLetter) {
    $this.before('<li class="splitter">' + firstLetter);
    lastLetter = firstLetter;
  }
});

.splitter {
  border-top: 1px solid;
  font-size: 1.25em;
  list-style: none;
  padding-top: 10px;
  text-transform: uppercase;
  padding-bottom: 10px;
  margin-top: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a href="#/"> john-doe/</a></li>
  <li><a href="#/"> jane-doe/</a></li>
  <li><a href="#/"> glen-doe/</a></li>
  <li><a href="#/"> daniel-doe/</a></li>
  <li><a href="#/"> matthew-doe/</a></li>
</ul>

Answer 1

使用CDATA标记包装javascript代码，以防止Blogger XML解析器解释它。

//<![CDATA[

var list = $('ul'),
    items = $('li', list);

// sort the list
var sortedItems = items.get().sort(function(a, b) {
  var aText = $.trim($(a).text().toUpperCase()),
      bText = $.trim($(b).text().toUpperCase());

   return aText.localeCompare(bText);
});

list.append(sortedItems); 

// create the titles
var lastLetter = '';
list.find('li').each(function() {
  var $this = $(this),
      text = $.trim($this.text()),
      firstLetter = text[0];

  if (firstLetter != lastLetter) {
    $this.before('<li class="splitter">' + firstLetter);
    lastLetter = firstLetter;
  }
});

//]]>

如何在Blogger上的JavaScript中修复匹配的结束标记错误？

1 个答案: