如何使用document.createElement()创建可解除的警报？
我尝试添加以下提醒：

<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>

使用document.createElement()函数，如以下代码所示：

document.createElement('

<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>'

);

但不断收到以下错误消息：Uncaught SyntaxError: Invalid or unexpected token .
浏览器控制台提示错误在此行<div class="alert alert-warning alert-dismissible fade show" role="alert">中
我做错了什么？

const parser = new DOMParser() const dom = parser.parseFromString(` <div class="alert alert-warning alert-dismissible fade show" role="alert"> <strong>Holy guacamole!</strong> You should check in on some of those fields below. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div>`, 'text/html') console.log(dom.body.firstChild)

1条答案

按热度按时间

w51jfk4q1#

您不能像这样使用createElement。

语法

创建元素（标记名）
createElement（标记名，选项）

标记名

一个字符串，指定要创建的元素的类型。创建的元素的nodeName用tagName的值初始化。不要在此方法中使用限定名（如“html：a”）。在HTML文档中调用createElement（）时，会在创建元素之前将tagName转换为小写。在Firefox、Opera和Chrome中，createElement（null）的工作方式与createElement（“null”）类似。
请参考MDN文件。
https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement
在这种情况下，您可以使用DOMParser将字符串解析为HTMLElement。
例如：

const parser = new DOMParser()

const dom = parser.parseFromString(`

<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>`, 'text/html')

console.log(dom.body.firstChild)

赞(0）回复(0）举报 2022-12-07

Bootstrap 如何使用'document.createElement()'创建一个可消除的引导警报？

1条答案

语法

标记名

相关问题

热门标签

最新问答