I'm trying to dynamically add SVG elements to a page but when I change the data attribute of the HTML object element a c,javascript,svg,firefox"/>

时间戳

首页 > 解决方案 > 为什么更新 HTML tag's data attribute cause the error "TypeError: document.body is null"

I'm trying to dynamically add SVG elements to a page but when I change the data attribute of the HTML object element a c

javascript - 为什么更新 HTML tag's data attribute cause the error "TypeError: document.body is null"

I'm trying to dynamically add SVG elements to a page but when I change the data attribute of the HTML object element a c

问题描述

I'm trying to dynamically add SVG elements to a page but when I change the data attribute of the HTML object element a console error pops up that I am unable to trap with try {} catch () {}. Here is a reduced example showing the behavior I am experiencing:

function init() {
  const obj = document.createElement("object")

  obj.setAttribute("data", "https://upload.wikimedia.org/wikipedia/commons/e/e8/Svg_example3.svg")
  obj.setAttribute("type", "image/svg+xml")

  document.body.append(obj)
}

document.addEventListener("DOMContentLoaded", init)

This is only happening in Firefox for me; Chrome and Safari work fine without error.

The error happens in this CodePen, not in the above snippet:

https://codepen.io/kalisjoshua/pen/dyWwBbR

The error I am see is:

enter image description here

The following code should be an easy solution to your question:

$("#example tfoot input").on('keyup change', function(event) {
    table
      .column( $(this).parent().index()+':visible' )
      .search( this.value )
      .draw();
    event.target.blur();
});

Reference: https://datatables.net/release-datatables/extensions/ColReorder/examples/initialisation/col_filter.htmll

标签： javascriptsvgfirefox

解决方案

推荐阅读