2

我需要在 html 头中插入新标签。不在文档中,在包含 html 的字符串中。所以正则表达式是唯一的方法。

<head>
<title>Html</title>
</head>

得到这样的东西:

<head>
<title>Html</title>
<script src="some_path.js"></script>
</head>

和更多:

<head>
<title>Html</title>
<script src="some_path.js"></script>
<script src="some_path_2.js"></script>
</head>
4

5 回答 5

1

如果您仅将 HTML 用作字符串而不是 DOM 文档,则可以在 head-close 标记之前进行简单的插入,而无需使用正则表达式。以下代码在此答案中使用了 splice 方法。它可以是一个函数而不是原型,并且为了我们的目的而删除第二个参数:

String.prototype.splice = function( idx, rem, s ) {
    return (this.slice(0,idx) + s + this.slice(idx + Math.abs(rem)));
};

var insertTag = function(newTag, html) {
  var end = html.indexOf('</head>');
  return html.splice(end, 0, newTag);
}

所以如果你有

var doc = '<head><title>Html</title></head>';

你跑了

var doc = insertTag('<script src="some_path.js"></script>', doc);

你会得到

<head><title>Html</title><script src="some_path.js"></script></head>

该功能很简单,并且不检查是否存在头部关闭标签,或任何其他可能需要采取的安全问题。它会带有换行符,并且只是作为如何避免 DOM(每个问题)和正则表达式(每个保存你的理智)的一般概念给出。

但是,如果您有可用的 DOM,请使用它。

于 2013-11-04T14:37:52.580 回答
1

这个有可能。像往常一样获取<head>元素并添加子元素:

document.getElementsByTagName("head")[0].appendChild(whatever);

有关其工作原理的更多信息,您可以在 Google 上搜索“Javascript DOM”。

于 2013-11-04T14:29:52.753 回答
1

用这个:

function injectScript (id, src, async) {
    var js,
    fjs = document.getElementsByTagName("head")[0];

    if (document.getElementById(id))
        return;

    js = document.createElement("script");
    js.id = id;
    js.src = src;
    js.type = 'text/javascript';

    if (async) {
        js.async = true;
    }

    fjs.appendChild(js, fjs);
}

将防止双重注入并支持异步脚本。

于 2013-11-04T14:35:37.100 回答
0
(function(){
  var newscript = document.createElement('script');
     newscript.type = 'text/javascript';
     newscript.async = true;
     newscript.src = 'some_path.js';
  (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(newscript);
})();
于 2018-01-31T10:30:27.030 回答
0

如果你想把页面的名字放到标题中,你可以在标题标签之前使用 window.onload ,它会搜索选择器插入到 .

在此示例中,我们正在页面中搜索 H3 标记。(可能是 h2,h1...)

<!doctype html>
<html lang="en">
<head>
[other metas]
<script>window.onload = function(){
var h3Text = document.querySelector("h3").innerText;
return document.querySelector("title").innerHTML = h3Text;
}</script>
<title></title>
</head><body><h3>This Will Go Into the Title Tag</h3>....
于 2021-08-16T16:47:41.443 回答