javascript - 1行js从另一个地方导入带有js的html代码?

标签 javascript jquery html ajax import

我想创建 1 行 .js import 可以将外部功能添加到我的网页。与插件等非常相似

这是我目前拥有的:

<!--index.html-->
<head>
</head> 
<body> 
  <!-- Here is my 1 line script -->
  <script src="importExHtml.js"></script>
</body>

这是我要导入的脚本:

/*importExHtml.js*/

function createRequestObject() {
    var obj;
    var browser = navigator.appName;
    if (browser == "Microsoft Internet Explorer") {
        obj = new ActiveXObject("Microsoft.XMLHTTP");
    } else {
        obj = new XMLHttpRequest();
    }
    return obj;
}

var http = createRequestObject();

function sendReq(req) {   
    http.open('get', req);
    http.onreadystatechange = handleResponse;
    http.send(null);
}

function handleResponse() {    
    if (http.readyState == 4) {
        var response = http.response;
        var newdiv = document.createNode("div");
        newdiv.innerHTML += response;
        document.body.appendNode(newdiv);
    }
}

sendReq("external.html");

这段代码是我在这里找到的。它将ajax请求发送到另一个页面 为此,我使用 Chrome 的网络服务器将 ajax 请求发送到 html 我有 external.html

**external.html**

<!-- For example here I import jquery etc. -->
 <script src="other.js"></script>

 <script type="text/javascript">
    alert("Hello from external");
 </script>

<h1>hello!</h1>

一切正常,我得到 <h1>hello!</h1>在我的 index.html 上,但来自 external.html 的脚本不起作用。我该如何修复它?或者也许我的愿景完全不正确?

最佳答案

您无法添加 <script>直接标记为文本。好吧,你可以添加它,但代码不会运行。这就是为什么脚本必须通过 document.createElement('script'); 注入(inject)这反过来又无法在您要导入的代码中运行。

解决方案:仅导入 HTML。

立即加载所有 JS - 缩小 - 并使用 jQuery 的 .on()或者类似于处理 DOM 中尚不存在的事物的事件。

至于警报,请在加载外部 HTML 后使用 XHR 回调运行某些内容。

关于javascript - 1行js从另一个地方导入带有js的html代码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43194930/

相关文章:

javascript - 通过 object.id 进行 Angular 跟踪

javascript - jQuery "show/hide div on click"和 "click outside to hide"不能一起工作

javascript - 在模板中使用动态变量将 nunjucks 与 htmlWebpackPlugin 一起使用

javascript - 选择所有选中的复选框返回所有复选框而不是使用 JQuery

javascript - 导出数据和固定数据表

jquery - 背景图片滚动,点击控制

javascript - 根据背景颜色改变汉堡菜单的颜色

javascript - 被推送到数组的缓存选择器

javascript - Ascensor.js IE8

html - 如何更改 SVG 图像中 stroke-dasharray 的 "starting point"?