innerHTML里嵌入script

让 innerHTML 进来的 script 代码跑起来

今天来简单聊聊如何让 innerHTML 进来的 scrip 代码跑起来的问题. 前台请求一个接口,接口返回一些 HTML 标签拼接成的字符串,以供前端直接 innerHTML 生成 DOM 元素,这样的做法非常普遍.但是你是否遇到过,如果字符串中拼接的 HTML 标签中有 script 标签,那么该段脚本是无法执行的,这并不是 bug,而是 w3c 的文档规定的. 比如如下这段代码,innerHTML 插入的脚本(alert)并不会执行: <div id="myDiv">

执行 innerHTML 里的 <script>

原文:执行 innerHTML 里的 <script> 背景有时候我们会有把一整段 HTML 动态塞进页面的需求,例如渲染了一个模板,从服务器端获取了一段广告代码等.一般情况下我们使用 container.innerHTML 即可.但是当 HTML 中出现 script 标签时,直接使用 innerHTML 并不会执行它. 一个例子 <div id="test">Hello HTML</div> <script> document.ge

在package.json里面的script设置环境变量，区分开发及生产环境。注意mac与windows的设置方式不一样

在package.json里面的script设置环境变量,区分开发及生产环境. 注意mac与windows的设置方式不一样. "scripts": { "publish-mac": "export NODE_ENV=prod&&webpack -p --progress --colors", "publish-win": "set NODE_ENV=prod&&webpack -p -

使用innerHTML生成的script节点不会发出请求与执行text属性

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="box"></div> <script> var boxEl = document.querySelector('#box') boxEl.innerH

在JavaScript里嵌入大量字符串常量的方法

[转]在JavaScript文件里嵌入大量字符串常量是经常遇到的事.有时为了省事,就把一些界面的HTML和CSS直接写在JS文件里.数量少还好,多的话就密密麻麻的一坨文字,讲究美观的文艺青年们,会用大量的字符连接符号甚至加上缩进,强制换成好几行.例如: var html = '<div>' + '<p>Hello</p>' + '<p>World'</p>' + '</div>'; 这还好,要是字符串里有不少双引号单引号,那就更麻烦了

Android H5混合开发（3）：原生Android项目里嵌入Cordova

前言如果安卓项目已经存在了,那么如何使用Cordova做混合开发? 方案1(适用于插件会持续增加或变化的项目): 新建Cordova项目并添加Android平台,把我们的安卓项目导入Android平台(我们的安卓项目需要做目录结构.配置等很多内容调整),后续开发中,可通过命令在Codova项目中统一快速添加插件,进行原生与H5通信. 方案2(适用于插件较稳定的项目): 新建Cordova项目并添加Android平台,添加相关插件,将Android平台下H5代码.插件相关的内容导入到我们的项目中

原生Android项目里嵌入Cordova

Android H5混合开发():原生Android项目里嵌入Cordova 如果安卓项目已经存在了,那么如何使用Cordova做混合开发? 方案1(适用于插件会持续增加或变化的项目): 新建Cordova项目并添加Android平台,把我们的安卓项目导入Android平台(我们的安卓项目需要做目录结构.配置等很多内容调整),后续开发中,可通过命令在Codova项目中统一快速添加插件,进行原生与H5通信. 方案2(适用于插件较稳定的项目): 新建Cordova项目并添加Android平台,添加相

在WinForm里嵌入WPF模拟公交运行状态

公司有个公交项目,模拟公交运行的时候使用的纯WinForm技术,5秒钟刷新一次,不仅看起来感觉很丑,而且性能上很有问题,听说一段时间后就会因为内存问题崩溃(估计是没释放非托管资源吧,不断重绘,非托管资源没有释放,时间长了导致内存泄露.不知道我的看法对不对,或许因为别的问题?因为我不参与该项目,所以只能猜测).后来技术总监找到我,说听说我对WPF有研究,我说略懂一二.他要我做个评估,如果用WPF技术来做这个的话,要多长时间.我说不好估计,但是我看到这个,脑里也有思路.他说现在也还没确定要不要用WP

在SWING里嵌入SWT的组件

http://zhanghan3366.blog.163.com/blog/static/6966305220110505351568/ ———————————————————————————————————————————————————————————————————————————— 先配环境,去eclipse主页上下了一个swt的包,www.eclipse.ort/swt. 压缩包里有一个swt.jar,还有几个dll文件. 有一个叫SWT_AWT的类, SWT_AWT的思想简单说就是

如何使用jQuery动态的在body里添加script标签？

var script = document.createElement('script'); script.type = 'text/jacascript'; script.src = 'url'; //填自己的js路径 $('body').append(script); 这个绝对稳,完美规避</script>问题

如何在原生Android项目里嵌入Cordova

背景: 这段时间在维护一个Cordova混合项目,以前稍微接触过Cordova,也写过简单的纯纯的Cordova的Demo,但是没有尝试过混合原生的Cordova. 在接到项目后比较了一下项目架构和Cordova的结构,发现其中的差别还是不少,主要差别就在项目是通过原生的Activity去启动CordovaActivity的.经验告诉我:这个Cordova被嵌入了原生当中,这货是个混合App. 由于自己之前没有这样玩过,所以就开始从头学习一下如何去将Cordova嵌入原生做一个最简单的混合App

在WinForms里嵌入MediaPlayer的一些版本问题, tlbimp导入, 以及不导入而纯用C#+字符串来动态调用.

网上很多写使用WindowsMediaPlayer WMP控件的文章. 大多数都是从工具栏或COM导入. 最近正在做的CEF整合Asp.Net Core Blazor server side的过程中, 因为CEF编译支持mp4的dll是涉及了版权的问题, 不能随便干的. 要播放mp4, 可以用WinForms代劳. 执行WMP只是一小段代码, 不想导入dll , 去查API. 发现了微软的官方文档, 和我使用的MediaPlayer的API , 有出入. ? 经过多方查证, 验证, 发现原来 M

QT里嵌入Python

刚看到一个软件,叫做,明明是QT做的,却带了很多pyd文件(Python编译后的文件),上网一查,果然有这套相关的东西: https://doc.qt.io/archives/qq/qq23-pythonqt.html https://github.com/commontk/PythonQt

thinkphp 模板里嵌入 php代码

<php> echo 'nihao';</php><?phpecho 'gge';?> Php代码可以和标签在模板文件中混合使用,可以在模板文件里面书写任意的PHP语句代码 ,包括下面两种方式: 第一种是使用php标签: <php>echo 'Hello,world!';</php> 第二种就是直接使用原始的php代码: <?php echo 'Hello,world!'; ?> 但是php标签或者php代码里面就不能再使用标签(包括

html里嵌入CSS的三种方式

在HTML中定义CSS的方式有:Embedding(嵌入式).Linking(引用式).Inline(内联式),下面通过实例为大家详细介绍下它们的特点在HTML中常用以下3种方式定义CSS:Embedding(嵌入式).Linking(引用式).Inline(内联式) 一.嵌入式使用HTML的style元素,在文档中定义CSS样式. 复制代码代码如下: <head> <style type="text/css"> h1{color:red} p{col

如何在react里嵌入iframe？

无法访问iframe地址 index.js文件 import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; ReactDOM.render(<App />, document.getElementById('root')); App.js import React from 'react' class App extends React.Component { render() {

让innerHTML方法添加到元素里的js可以被解析执行

<!DOCTYPE html> <html> <head> </head> <body> <div id="test" style="background:skyblue">test innerHTMLJS</div> <div onclick="say();" style="background:skyblue; margin:20px;&quo

【HTML】嵌入图像

img元素允许我们在HTML文档里嵌入图像. 要嵌入一张图像需要使用src和alt属性,代码如下: <img src="../img/example/img-map.jpg" alt="Products Image" width="580" height="266" /> 显示效果: 1 在超链接里嵌入图像 img元素的一个常见用法是结合a元素创建一个基于图像的超链接,代码如下: <a href="

【HTML 元素】嵌入图像

img元素允许我们在HTML文档里嵌入图像. 要嵌入一张图像需要使用src和alt属性,代码如下: <img src="../img/example/img-map.jpg" alt="Products Image" width="580" height="266" /> 显示效果: 1 在超链接里嵌入图像 img元素的一个常见用法是结合a元素创建一个基于图像的超链接,代码如下: <a href="

博客代码：iframe—网页中嵌入其他网页

iframe 是一个可以把另外一个网页嵌入到一个网页里的代码,非常有用.对于一个内容不错的网页,要方便地把它搬到自己的博客里,用这个代码最合适.而对于在新浪博客里不支持的一些网页效果和代码,可先把他们设置好,在支持他们的网站上使用,或上传到一个免费的网络空间或网络硬盘里,获取相应的网页地址,然后用 iframe嵌入到新浪博客里,非常好用! 一.固定位置的iframe代码: <DIV align=center><IFRAME src="http://weather.265.com

innerHTML里嵌入script

热门专题