Fatal编程技术网
  • csharp/
  • C# CSS样式未应用于JavaScript-XML/XSLT-ASP.NET-C输出的HTML元素#

C# CSS样式未应用于JavaScript-XML/XSLT-ASP.NET-C输出的HTML元素#

c# javascript html asp.net css

C# CSS样式未应用于JavaScript-XML/XSLT-ASP.NET-C输出的HTML元素#,c#,javascript,html,asp.net,css,C#,Javascript,Html,Asp.net,Css,我目前正在为一些大学课程学习XML/XSLT技术。我正在通过JavaScript函数处理XML文件和XSLT文件，并将生成的HTML输出到ASP.NET文档中 出于某种原因，HTML没有应用任何样式，尽管.aspx文档具有指向CSS文件的正确链接。.aspx文档上的另一个HTML，未由JavaScript输出，的样式设置正确 母版页： <%@ Master Language="C#" AutoEventWireup="true" CodeFile="master.master.cs" In

我目前正在为一些大学课程学习XML/XSLT技术。我正在通过JavaScript函数处理XML文件和XSLT文件，并将生成的HTML输出到ASP.NET文档中

出于某种原因，
HTML
没有应用任何样式，尽管
.aspx
文档具有指向CSS文件的正确链接。
.aspx
文档上的另一个
HTML
，未由
JavaScript
输出，的样式设置正确

母版页：

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="master.master.cs" Inherits="master" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <!-- Meta -->
        <title>Site Title</title>
        <base href="http://co-web.lboro.ac.uk/colb3web/" />
        <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />

        <!-- Styles -->
        <link rel="stylesheet" href="css/style.css" />

        <!-- Scripts -->
        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
        <script type="text/javascript" src="js/script.js"></script>

        <!-- Head Placeholder -->
        <asp:ContentPlaceHolder id="head" runat="server"></asp:ContentPlaceHolder>

    </head>

    <body>

        <article id="site">

            <!-- HEADER -->
            <header id="site_header" class="section">
                <section id="site_branding">
                    <h1>Site title</h1>
                </section>

                <!-- Header Navigation -->
                <nav id="site_header-navigation" class="subsection">Header navigation</nav>

            </header>

            <!-- PAGE -->
            <article id="page">

                <!-- Header -->
                <header id="page_header" class="section">Page header</header>

                <!-- Body Placeholder -->
                <asp:ContentPlaceHolder id="body" runat="server"></asp:ContentPlaceHolder>

                <!-- Footer -->
                <footer id="page_footer" class="section">Page footer</footer>

            </article>

            <!-- FOOTER -->
            <footer id="site_footer" class="section">

                <!-- Footer Navigation -->
                <nav id="site_footer-navigation" class="subsection">Footer navigation</nav>

            </footer>

        </article>

    </body>

</html>
JavaScript文件：

/* HTTP Request */
function loadXML(file) {
    if (window.XMLHttpRequest) {
        // code for Chrome, Firefox, Opera, etc.
        xhttp = new XMLHttpRequest();
    } else {
        // code for IE
        xhttp = new ActiveXObject("Microsoft.XMLHTTP"); // Different ActiveXObject for IE
    };
    xhttp.open("GET", file, false);
    try { xhttp.responseType = "msxml-document"; } catch (e) { }; // Set responseType for IE 9+
    xhttp.send(null);
    return xhttp.responseXML;
};

/* Process & Output */
function processXML(location, xml, xsl) {
    if (window.ActiveXObject || xhttp.responseType == "msxml-document" || "ActiveXObject" in window) { // Added criteria for IE detection
        // code for IE
        ex = xml.transformNode(xsl);
        document.getElementById(location).innerHTML = ex;
    } else if (document.implementation && document.implementation.createDocument) {
        // code for Chrome, Firefox, Opera, etc.
        xsltProcessor = new XSLTProcessor();
        xsltProcessor.importStylesheet(xsl);
        resultDocument = xsltProcessor.transformToFragment(xml, document);
        document.getElementById(location).innerHTML = '';
        document.getElementById(location).appendChild(resultDocument);
    };
};

/* HTTP Request, Process & Output */
function outputXML(location, xmlFile, xslFile) {
    xml = loadXML(xmlFile);
    xsl = loadXML(xslFile);
    processXML(location, xml, xsl);
};
有什么建议吗？

尝试更改此选项：

document.getElementById(location).innerHTML = '';
document.getElementById(location).appendChild(resultDocument);
为此：

document.getElementById(location).innerHTML = resultDocument;
如果所有者文档本身是HTMLDocument，或者样式表的输出方法是HTML，则transformToFragment将只生成HTMLDOM对象

ref:

你能给我们看看你的css吗？当然可以。现在添加。生成的
.aspx
文件是否位于查看CSS文件的正确位置/路径？CSS文件已从母版页成功链接到，页面上的其他元素正在设置样式，而不是JavaScript生成的HTML。我感觉生成的标记可能格式不正确。您可以尝试运行它吗？“*”选择器将针对所有元素，因此如果包含css文件，则它必须是无效/格式错误的html。这就是随后输出到页面的内容：
[object DocumentFragment]
，这就是我使用appendChild的原因。“如果所有者文档本身是HTMLDocument，或者样式表的输出方法是HTML，则transformToFragment将只生成HTMLDOM对象”。。。这是否意味着该文件不能是
.aspx
文件？我刚刚将XSLT文件的输出方法更改为HTML，问题解决了！非常感谢您没有问题，如果答案对您有帮助，请随时标记为答案。 
document.getElementById(location).innerHTML = '';
document.getElementById(location).appendChild(resultDocument);

document.getElementById(location).innerHTML = resultDocument;