在 javascript 变量中存储 HTML 或 XML 代码

Question

我想在 javascript 变量中存储一些 HTML/XML 标记。问题是文字比较大。例如，如何将以下 XML 片段存储在 javascript 变量中？

    <QuestionForm xmlns="[the QuestionForm schema URL]">
  <Overview>
    <Title>Game 01523, "X" to play</Title>
    <Text>
      You are helping to decide the next move in a game of Tic-Tac-Toe.  The board looks like this:
    </Text>
    <Binary>
      <MimeType>
        <Type>image</Type>
        <SubType>gif</SubType>
      </MimeType>
      <DataURL>http://tictactoe.amazon.com/game/01523/board.gif</DataURL>
      <AltText>The game board, with "X" to move.</AltText>
    </Binary>
    <Text>
      Player "X" has the next move.
    </Text>
  </Overview>
  <Question>
    <QuestionIdentifier>nextmove</QuestionIdentifier>
    <DisplayName>The Next Move</DisplayName>
    <IsRequired>true</IsRequired>
    <QuestionContent>
      <Text>
        What are the coordinates of the best move for player "X" in this game?
      </Text>
    </QuestionContent>
    <AnswerSpecification>
      <FreeTextAnswer>
        <Constraints>
          <Length minLength="2" maxLength="2" />
        </Constraints>
        <DefaultText>C1</DefaultText>
      </FreeTextAnswer>
    </AnswerSpecification>
  </Question>
  <Question>
    <QuestionIdentifier>likelytowin</QuestionIdentifier>
    <DisplayName>The Next Move</DisplayName>
    <IsRequired>true</IsRequired>
    <QuestionContent>
      <Text>
        How likely is it that player "X" will win this game?
      </Text>
    </QuestionContent>
    <AnswerSpecification>
      <SelectionAnswer>
        <StyleSuggestion>radiobutton</StyleSuggestion>
        <Selections>
          <Selection>
            <SelectionIdentifier>notlikely</SelectionIdentifier>
            <Text>Not likely</Text>
          </Selection>
          <Selection>
            <SelectionIdentifier>unsure</SelectionIdentifier>
            <Text>It could go either way</Text>
          </Selection>
          <Selection>
            <SelectionIdentifier>likely</SelectionIdentifier>
            <Text>Likely</Text>
          </Selection>
        </Selections>
      </SelectionAnswer>
    </AnswerSpecification>
  </Question>
</QuestionForm>

Answer 1

我假设您的问题是如何获取确切的字符串，而不是您从 Web 服务或 Ajax 调用等中检索到的字符串。虽然由于很多原因这是一个非常糟糕的主意，但要回答这个问题......

---

在 JavaScript 中没有真正的好方法。 一些浏览器通过在行尾放置 \ 来支持行继续，因此您可以执行以下操作：

var xml = '<QuestionForm xmlns="[the QuestionForm schema URL]">\
  <Overview>\
    <Title>Game 01523, "X" to play</Title>\
    ...';

但这是非标准的，实际上直接与 JS 规范相矛盾：

“LineTerminator”字符不能 出现在字符串文字中，即使 前面有一个反斜杠。

唯一真正可靠的方法是手动连接字符串：

var xml = '<QuestionForm xmlns="[the QuestionForm schema URL]">' + "\n" +
'      <Overview>' + "\n" +
'        <Title>Game 01523, "X" to play</Title>' + "\n" +
'        ...';

你可以像这样让它更整洁一点：

var xml = ['<QuestionForm xmlns="[the QuestionForm schema URL]">',
'      <Overview>',
'        <Title>Game 01523, "X" to play</Title>'
'        ...'].join("\n");

但它仍然很糟糕。

此外，使用所有这些方法，您都必须转义任何单引号，即将' 替换为\'。乍一看，我没有在您的 XML sn-p 中看到任何内容，这很好。

Answer 2

我认为您可能希望将 html/xml 代码存储在 javascript 中并显示在 textarea 或其他一些输入元素中。如果这是您的意图，这将对您有所帮助。

而不是 javascript 变量，将您的代码存储在 div 中并使用 css ex:display:none 隐藏。当你想显示代码时，你可以使用$('#div id').text()。

Answer 3

我建议你使用 JSON，伙计。它不那么冗长。并且 javascript 有方法可以很好地处理它。如果您稍后需要在类中使用 XML，您可以编写一个简单的适配器。

Answer 4

var string = (<r><![CDATA[

   The text string goes here.  Since this is a XML CDATA section,
   stuff like <> work fine too, even if definitely invalid XML. 

]]></r>).toString();