Javascript：appendChild() 出现意外令牌非法错误

发布于 2024-12-05 09:21:22 字数 678 浏览 1 评论 0原文

我是 javascript 新手，但我在这行代码中遇到了“意外令牌非法”错误：

switch (city) {
    case "london":
        var newdiv = document.createElement('<div id="london" class="option-area"><label class="city">From London to…?</label>
                <select class="city">
                    <option></option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select><br /></div>');

        document.all.bookingform.appendChild(newdiv);
        break;
}

这可能是一个非常愚蠢的错误，但我已经尝试了几个小时来让这个块正常工作。请帮忙！

原文

I'm new to javascript, but I'm getting an "Unexpected Token ILLEGAL" error with this line of code:

switch (city) {
    case "london":
        var newdiv = document.createElement('<div id="london" class="option-area"><label class="city">From London to…?</label>
                <select class="city">
                    <option></option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                </select><br /></div>');

        document.all.bookingform.appendChild(newdiv);
        break;
}

It's probably a very dumb mistake, but I've tried for hours to get this block working. Please help!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

笑叹一世浮沉 2024-12-12 09:21:22

您的代码中有几个错误：

1）document.createElement()< /code> function采用单个参数作为元素名称，而不是 HTML/XML 片段来解析和构建 DOM 树。但是，您可以通过构建匿名包装元素并设置其内部 HTML，然后将其第一个子元素附加到目标元素来实现您的目标，例如：

var wrapperDiv = document.createElement("div");
wrapperDiv.innerHTML = '<div id="london" class="option-area"><label...';
document.all.bookingform.appendChild(wrapperDiv.firstChild);

2）字符串不能跨越多行，但您可以构建一个多行字符串，如下所示：

var str = '<div id="london" class="option-area">' +
          '  <label class="city">From London to…?</label>' +
          '  <select class="city">' + // ...
          '</div>';

如果您实际上想要在字符串中添加换行符，您可以在字符串文字中使用换行符转义序列 (\n)，例如 'Hello\nnewline!'。

[编辑]

当然，如果您只是想将 HTML 附加到文档正文中已有的元素，您可以这样做：

var mydiv = document.getElementById('mydiv');
if (mydiv) {
  mydiv.innerHTML += '<div class="newdiv">' +
                     ' New child will be appended...' +
                     '</div>';
}

但是请注意，在修改上述表单时，各种浏览器中都会存在一些怪癖；考虑使用 JavaScript 库，例如 jQuery、ExtJS 或 Prototype.js。

There are a couple errors in your code:

1) The document.createElement() function takes a single argument as the element name, not an HTML/XML snippet to parse and build a DOM tree. However you chould achieve your goal by building an anonymous wrapper element and setting its inner HTML, then appending its first child to the target element, for example:

var wrapperDiv = document.createElement("div");
wrapperDiv.innerHTML = '<div id="london" class="option-area"><label...';
document.all.bookingform.appendChild(wrapperDiv.firstChild);

2) Strings cannot span multiple lines but you can build a multiline string like this:

var str = '<div id="london" class="option-area">' +
          '  <label class="city">From London to…?</label>' +
          '  <select class="city">' + // ...
          '</div>';

If you actually want newlines in the string you can use the newline escape sequence (\n) in a string literal, like 'Hello\nnewline!'.

[Edit]

Of course, if you're just trying to append HTML to an element already in the document body you do this:

var mydiv = document.getElementById('mydiv');
if (mydiv) {
  mydiv.innerHTML += '<div class="newdiv">' +
                     ' New child will be appended...' +
                     '</div>';
}

Note however that there are quirks in various browsers when modifying forms such as above; consider using a JavaScript library such as jQuery, ExtJS, or Prototype.js.

回复收藏 0 原文