Question

使用CMS，阻止编辑<head>元素的HTML源代码。

例如，我想在<title>标记上方添加以下内容：

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Answer 1

您可以选择并正常添加：

$('head').append('<link />');

Answer 2

JavaScript的：

document.getElementsByTagName('head')[0].appendChild( ... );

像这样制作DOM元素：

link=document.createElement('link');
link.href='href';
link.rel='rel';

document.getElementsByTagName('head')[0].appendChild(link);

Answer 3

的jQuery

$('head').append( ... );

JavaScript的：

document.getElementsByTagName('head')[0].appendChild( ... );

Answer 4

在最新的浏览器（IE9 +）中，您还可以使用document.head：

示例：

var favicon = document.createElement('link'); favicon.id = 'myFavicon'; favicon.rel = 'shortcut icon'; favicon.href = 'http://www.test.com/my-favicon.ico'; document.head.appendChild(favicon);

Answer 5

您可以使用innerHTML来连接额外的字段字符串;

document.head.innerHTML = document.head.innerHTML + '<link rel="stylesheet>...'

但是，您无法保证首次加载后浏览器会识别您添加到头部的额外内容，并且您可能会获得FOUC（无格式内容的闪烁）因为加载了额外的样式表。

我多年来都没有看过API，但你也可以使用document.write，这是为这种行为而设计的。但是，这将要求您阻止页面呈现，直到您的初始AJAX请求完成。

Answer 6

创建一个临时元素（例如DIV），将HTML代码分配给其innerHTML属性，然后将其子节点附加到{{1元素一个接一个。例如，像这样：

HEAD

与通过var temp = document.createElement('div'); temp.innerHTML = '<link rel="stylesheet" href="example.css" />' + '<script src="foobar.js"><\/script> '; var head = document.head; while (temp.firstChild) { head.appendChild(temp.firstChild); }重写整个HEAD内容相比，这不会以任何方式影响innerHTML元素的现有子元素。

请注意，以这种方式插入的脚本显然不会自动执行，而成功应用样式。因此，如果您需要执行脚本，则应使用Ajax加载JS文件，然后使用eval()执行其内容。

Answer 7

尝试纯粹的javascript：

图书馆JS：

appendHtml = function(element, html) {
    var div = document.createElement('div');
    div.innerHTML = html;
    while (div.children.length > 0) {
        element.appendChild(div.children[0]);
    }
}

类型： appendHtml(document.head, '<link rel="stylesheet" type="text/css" href="http://example.com/example.css"/>');

或jQuery：

$('head').append($('<link rel="stylesheet" type="text/css" />').attr('href', 'http://example.com/example.css'));

Answer 8

我不知道为什么我讨厌使用jquery。我给了一个头脑的头衔。

override func layoutSpecThatFits(_ constrainedSize: ASSizeRange) -> ASLayoutSpec {

    asSoundIcon.style.preferredSize = CGSize(width: 16, height: 16)
    asSoundIcon.style.maxSize = CGSize(width: 16, height: 16)
    asSoundIcon.style.minSize = CGSize(width: 16, height: 16)
    asBackView.style.minSize = CGSize(width: 30, height: 48)
    asTextLabel.style.minSize = CGSize(width: 30, height: 15)
    asTextLabel.style.maxWidth = ASDimension(unit: .points, value: screenWidth - 50)

    let asBackViewLayout = ASInsetLayoutSpec(insets: UIEdgeInsets(top: 4, left: 4, bottom: 4, right: 24), child: self.asBackView)

    let asTextLabelLayout = ASInsetLayoutSpec(insets: UIEdgeInsets(top: 6, left: 12, bottom: 6, right: 36), child: asTextLabel)

    let asNewCenterTextLabelLayout = ASCenterLayoutSpec(horizontalPosition: .start, verticalPosition: .center, sizingOption: .minimumWidth, child: asTextLabelLayout)

    let asOverlayLayout = ASOverlayLayoutSpec(child: asNewCenterTextLabelLayout, overlay: asBackViewLayout)

    let asSoundVerticalLayout = ASRelativeLayoutSpec(horizontalPosition: .start, verticalPosition: .center, sizingOption: .minimumSize, child: asSoundIcon)

    let asSoundLayout = ASStackLayoutSpec(direction: .horizontal, spacing: 0.0, justifyContent: .start, alignItems: .start, flexWrap: .noWrap, alignContent: .start, lineSpacing: 0.0, children: [asOverlayLayout, asSoundVerticalLayout])

    return asSoundLayout
}

Answer 9

使用jquery，您还有其他选择：

$('head').html($('head').html() + '...');

无论如何它正在运作。 JavaScript选项其他人说，这也是正确的。

如何通过jquery / javascript添加任何内容？

9 个答案: