fetch CSS rules in javascript/jquery_问答_开发者

开发者 https://www.devze.com 2023-02-08 01:26 出处：网络

i want the rules of css to be fetched and displayed in drop down for this i am doing.. var opnr = window.opener ;

i want the rules of css to be fetched and displayed in drop down for this i am doing..

var opnr = window.opener ; 
function getStyle() { 
    var selCss=opnr.document.getElementById("CSS");
    loadjscssfile("css/"+selCss.value,"css");
    var cssRef = document.styleSheets[0];
    cssRef.href ='css/'+ selCss.value;
    var classes = cssRef.rules || cssRef.cssRules ;
    var select = document.getElementById('stylefieldid');//document.createElement('select');

    for(var x=0;x<classes.length;x++) { 
       var option = document.createElement('option');
       var className = classes[x].selectorText;
       if(className.startsWith('.')){
           className = className.substring(1,className.length);
       }
          option.text = className;
          option.value = className;
       select.add(option);
    } 
} 


function loadjscssfile(filename, filetype){
    var fileref; 
    if (filetype=="js")
    {
        fileref=document.createElement("script");
        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", filename);
    } 
    else if (filetype=="css"){
        fileref=document.createElement("link");
        fileref.setAttribute("rel", "stylesheet");
        fileref.setAttribute("type", "text/css");
        fileref.setAttribute("href", fil开发者_Python百科ename);
    } 
    if (typeof fileref!="undefined")
        document.getElementsByTagName("head")[0].appendChild(fileref);
}

but this is showing abrupt behaviour the variable classes comes to be undefined sometimes while it has value sometimes... i tried alerting cssRef.href it gives me correct value..

the code is not at all working on FF any work around

Any help on this?? why its happening like this

any alternative in jquery????

Are you sure your code is firing after the page has loaded? Try calling it after your code in the <body onload="someFunction()"> or at the bottom of the page

Done it using css parser on server side and passed the list to jsp page... and is working on all modern day browsers..

Thanks for the reply :)