2013-11-04 108 views
2

我需要在html頭中插入新標籤。不在文檔中,在包含html的字符串中。所以正則表達式是唯一的方法。在html頭中插入新的標籤,用普通的JavaScript

​​

而得到這樣的:

<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> 
+0

''是一個標籤,就像任何其他頁面...不需要正則表達式。你可以附加到它 – charlietfl

+0

由於這不是DOM解析,但字符串解析,如何避免正則表達式,並解析出字符串呢?一個簡單的分詞器會創造奇蹟。 –

+0

什麼是您無法訪問DOM的上下文? –

回答

1

這是可能的。剛剛拿到<head>元素,將其添加的孩子像往常一樣:

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

有關如何工作的,你可以谷歌「的JavaScript DOM」的更多信息。

+0

每OP「不在文檔[DOM],在包含HTML的字符串。「 –

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); 
} 

將防止雙重注塑和支持異步腳本。

1

如果您只有HTML可用作字符串,而不是DOM文檔,那麼您可以在頭部關閉標籤之前進行簡單的插入而不訴諸正則表達式。以下代碼使用拼接方法in this answer。它可以由一個功能,而不是一個原型,併爲我們的目的去除第二個參數:

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可用 - 請使用它。

+1

考慮問題和(可怕的)要求不使用DOM的範圍非常有限,這可能是最簡單可行的方法。 – Gareth

+0

我甚至可能會使用術語‘啞巴’,而不是簡單,但它的工作。對於對術語「工作」的某些有限定義。 –

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); 
})();