react代码资料:

文件:packages/react-dom/src/client/setInnerHTML.js

/*** Copyright (c) Facebook, Inc. and its affiliates.** This source code is licensed under the MIT license found in the* LICENSE file in the root directory of this source tree.** @flow*/import {Namespaces} from '../shared/DOMNamespaces';
import createMicrosoftUnsafeLocalFunction from '../shared/createMicrosoftUnsafeLocalFunction';// SVG temp container for IE lacking innerHTML
let reusableSVGContainer;/*** Set the innerHTML property of a node** @param {DOMElement} node* @param {string} html* @internal*/
const setInnerHTML = createMicrosoftUnsafeLocalFunction(function(node: Element,html: string,
): void {// IE does not have innerHTML for SVG nodes, so instead we inject the// new markup in a temp node and then move the child nodes across into// the target nodeif (node.namespaceURI === Namespaces.svg && !('innerHTML' in node)) {reusableSVGContainer =reusableSVGContainer || document.createElement('div');reusableSVGContainer.innerHTML = '<svg>' + html + '</svg>';const svgNode = reusableSVGContainer.firstChild;while (node.firstChild) {node.removeChild(node.firstChild);}while (svgNode.firstChild) {node.appendChild(svgNode.firstChild);}} else {node.innerHTML = html;}
});export default setInnerHTML;

文件:packages/react-dom/src/shared/createMicrosoftUnsafeLocalFunction.js

/*** Copyright (c) Facebook, Inc. and its affiliates.** This source code is licensed under the MIT license found in the* LICENSE file in the root directory of this source tree.*//* globals MSApp *//*** Create a function which has 'unsafe' privileges (required by windows8 apps)*/
const createMicrosoftUnsafeLocalFunction = function(func) {if (typeof MSApp !== 'undefined' && MSApp.execUnsafeLocalFunction) {return function(arg0, arg1, arg2, arg3) {MSApp.execUnsafeLocalFunction(function() {return func(arg0, arg1, arg2, arg3);});};} else {return func;}
};export default createMicrosoftUnsafeLocalFunction;

文件:packages/react-dom/src/shared/DOMNamespaces.js

/*** Copyright (c) Facebook, Inc. and its affiliates.** This source code is licensed under the MIT license found in the* LICENSE file in the root directory of this source tree.*/const HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
const MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML';
const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';export const Namespaces = {html: HTML_NAMESPACE,mathml: MATH_NAMESPACE,svg: SVG_NAMESPACE,
};

关于Windows8系列的APP的网页的innerHTML操作需要权限的相关文档:

execUnsafeLocalFunction method : https://msdn.microsoft.com/zh...

The new Windows 10 security model for HTML/Javascript apps. : https://github.com/MicrosoftE...


关于IE浏览器无法一些元素无法设置innerHTML属性的解决方案和原因:

https://stackoverflow.com/que...

The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.

function setTBodyInnerHTML(tbody, html) {var temp = tbody.ownerDocument.createElement('div');temp.innerHTML = '<table>' + html + '</table>';tbody.parentNode.replaceChild(temp.firstChild.firstChild, tbody);
}

【速记】React解决IE浏览器svg标签不支持innerHTML操作的问题及相关拓展知识相关推荐

  1. 解决微信浏览器video标签自动播放视频失效

    正常在浏览器好好的视频,在微信内置浏览器中点击播放全屏,样式也不一样,自动播放失效.罪魁祸首是微信把video标签都成微信规则的了.下面方式可以解决视频播放全屏以及不能自动播放的问题. <vid ...

  2. svg js动态生成svg标签

    1.声明svg命名空间let xx="http://www.w3.org/2000/svg";2.创建svg标签let x=document.createElementNS(xx, ...

  3. 使用selenium解决svg标签定位问题

    使用正常的定位方式无法识别到svg标签: 解决方法: //div[@class="ant-table-tbody"]/[name()="svg"]/[name( ...

  4. svg标签和svg文件区别_什么是SVG文件? SVG图片和标签说明

    svg标签和svg文件区别 SVG (SVG) SVG or Scalable Vector Graphics is a web standard for defining vector-based ...

  5. mac下chrome浏览器的标签页、进程和内存分配

    因为最近要解决网页经常崩溃的问题,所以去研究了一下chrome浏览器的标签页和进程的关系,以及标签页对应进程的内存分配. 标签页和进程的对应关系 当chrome浏览器开启但是没有任何一个标签页的时候, ...

  6. ios开发跳转safari_阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页

    最近为了更好地接触移动Web 开发狠心购买了一台ipad mini(之前一直都是借同学的,借多了就不好意思了).拿来调试DeveMobile 与EaseMobile 主题 时候发现了不少问题,现在在一 ...

  7. [html] 如何解决微信浏览器视频点击自动全屏的问题?

    [html] 如何解决微信浏览器视频点击自动全屏的问题? 1.1 页面内播放 X5内核视频在用户点击后默认会进入全屏播放,前端可以设置video的x5-playsinline属性来将视频限定于网页内部 ...

  8. 一行代码解决ie浏览器的兼容

    x-ua-compatible 头标签大小写不敏感,必须用在 head 中,必须在除 title 外的其他 meta 之前使用. 1.使用一行代码来指定浏览器使用特定的文档模式. <meta h ...

  9. html svg标签中插入img image标签不显示的问题

    svg标签中插入img image标签(图片)不显示的问题 1 问题: 在使用svg画图中想要使用img标签插入图片,可以图片不显示 <!--S svg外框 --> <div cla ...

最新文章

  1. 官宣!VS Code Python 全新功能在 PyCon China 全球首发!
  2. 转载:配置nginx支持pathinfo功能
  3. python if语句多个条件-python – if / elif语句的多个条件
  4. 永洪科技携手华为构建金融智慧运营与商业智能方案,解决金融敏捷分析难题
  5. Visual Studio 2008 响应很慢 是怎么回事?
  6. python执行sqlserver存储过程_python – 从SqlAlchemy调用MSSQL存储过程
  7. Oracle入门(十二J)之同义词
  8. 超9000万LoRa节点,全球物联网的事实标准已形成?
  9. 优秀的程序员是如何诞生的?
  10. 31. Next Permutation
  11. 人工智能算法自动化测试_自动化:算法如何塑造我和你的生活
  12. Phantomjs 生成多页PDF
  13. ×××全功能邮件系统(3)
  14. CRM 安装不规范,亲人两行泪
  15. 【Java】QuickHit游戏
  16. SATA硬盘分区设置与安装详解
  17. 一个小白程序员的目标
  18. python hist2d_具有二维数组的Python Matplotlib Hist2d
  19. Leetcode(347)——前 K 个高频元素
  20. 计算机程序框图符号,数据流程图符号详解

热门文章

  1. java 麻将的发牌与洗牌_JAVA程序设计(11)-----面对对象初级设计 麻将 创建麻将牌 然后洗牌 发牌~ 恩 就这样...
  2. 自由职业为何会崛起成为一股暗潮?
  3. 2021年3月8日:MyBatis框架学习笔记02:利用MyBatis实现CRUD操作
  4. 宇视网络视频录像机国标对接配置指导
  5. OSM地图本地发布(三)-----自定义图层提取
  6. 计算机双代号网络图,双代号网络图计算机自动绘制研究.pdf
  7. antd Card组件默认选中
  8. Ubuntu下Logi MX Ergo自定义按键
  9. 海贼王热血航线服务器维护,《航海王热血航线》游戏进不去如何解决 维护中快速解决办法...
  10. 工业智能网关BL110应用之59:如何实现智能楼宇控制BACnet 接入MQTT Client One云平台