We help IT Professionals succeed at work.

Parsing a css declaration

rjohnsonjr
rjohnsonjr asked
on
291 Views
Last Modified: 2013-12-24
I need to be able to parse css content into an array or probably a structure.

Does anyone have any sample code to get me started?


Here is sample css

.RandyBasicText {

      font-family: Verdana, Arial, Helvetica, sans-serif;

      font-size: 10px;

      line-height: 14px;

      font-weight: normal;

      color: #000000;

}

.RandyBoldText {

      font-family: Verdana, Arial, Helvetica, sans-serif;

      font-size: 12px;

      line-height: 14px;

      font-weight: bold;

      color: #000000;

}

.RandyBasicText {

      font-family: Verdana, Arial, Helvetica, sans-serif;

      font-size: 12px;

      line-height: 14px;

      font-weight: normal;

      color: #000000;

}
Comment
Watch Question

you can do this a couple ways depending on what you're looking for...

method 1: (array with each class or id reference)
--------------------------------------------------------------------------------

<cfset ABSOLUTE_PATH = " the path to your style sheet example: C:\folder1\folder\styles ">
<cfset filePath = ABSOLUTE_PATH&"\stylesheet.css">
<cffile action="read" file="#filePath#" variable="styleSheet">

<cfset count = 1>
<cfset i = 1>
<cfset mx = len(styleSheet)>
<cfset myArray = arrayNew(1)>
<cfloop condition="count lte mx">
 <cfset myFind = reFindNoCase("\s*[\.\##]?[a-z]{1}[a-z0-9]*\s*\{{1}[^\}]*\}{1}\s*",styleSheet,count,true)>
 <cfset myArray[i] = mid(styleSheet,myFind.pos[1],myFind.len[1])>
 <cfset count = myFind.len[1] + myFind.pos[1]>
 <cfset i = i + 1>
</cfloop>

<cfdump var="#myArray#">

or method 2: (list of class or id reference names and their styles listed in a strcut within your array)
---------------------------------------------------------------------------------------------------------------------

<cfset ABSOLUTE_PATH = " the path to your style sheet example: C:\folder1\folder\styles ">
<cfset filePath = ABSOLUTE_PATH&"\stylesheet.css">
<cffile action="read" file="#filePath#" variable="styleSheet">

<cfset count = 1>
<cfset i = 1>
<cfset mx = len(styleSheet)>
<cfset myArray2 = arrayNew(2)>
<cfloop condition="count lte mx">
 <cfset myFind = reFindNoCase("(\s*[\.\##]?[a-z]{1}[a-z0-9]*\s*)(\{{1})([^\}]*)(\}{1}\s*)",styleSheet,count,true)>
 <cfset myArray2[i][1] = trim(mid(styleSheet,myFind.pos[2],myFind.len[2]))>
 <cfset myStyles = trim(mid(styleSheet,myFind.pos[4],myFind.len[4]))>
 <cfset myArray2[i][2] = structNew()>
 <cfset start = 1>
 <cfset x = 1>
 <cfset ix = len(myStyles)>
  <cfloop condition="start lte ix">
   <cfset myInnerFind = reFindNoCase("[a-z\-]+\:{1}\s?[^\;]+\;{1}",myStyles,start,true)>
   <cfset myArray2[i][2]['style#x#'] = mid(myStyles,myInnerFind.pos[1],myInnerFind.len[1])>
   <cfset start = myInnerFind.len[1] + myInnerFind.pos[1]>
   <cfset x = x + 1>
  </cfloop>
 <cfset count = myFind.len[1] + myFind.pos[1]>
 <cfset i = i + 1>
</cfloop>

<cfdump var="#myArray2#">



--------
hope that helps,
-tb55
if you have style like this as well...

example:

.RandyBasicText, .RandyBoldText, .RandyOtherText {
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 10px;
     line-height: 14px;
     font-weight: normal;
     color: #000000;
}

modify this line in either one...

<cfset myFind = reFindNoCase("(\s*[\.\##]?[a-z]{1}[a-z0-9]*\s*)(\{{1})([^\}]*)(\}{1}\s*)",styleSheet,count,true)>

to this...

<cfset myFind = reFindNoCase("(\s*[^\}]+\s*)(\{{1})([^\}]*)(\}{1}\s*)",styleSheet,count,true)>

Author

Commented:
Thanks I am working on this today.  I will let you know how I make out.

-Randy

Author

Commented:
Hello,

I am getting this error.  I have been playing around with it but have not been able to figure it out.  This is for Method 2:

 Parameter 2 of function Mid which is now 0 must be a non-negative integer
 
The error occurred in /home/www/cssparser/index.cfm: line 37

35 :   <cfloop condition="start lte ix">
36 :    <cfset myInnerFind = reFindNoCase("[a-z\-]+\:{1}\s?[^\;]+\;{1}",myStyles,start,true)>
37 :    <cfset myArray2[i][2]['style#x#'] = mid(myStyles,myInnerFind.pos[1],myInnerFind.len[1])>
38 :    <cfset start = myInnerFind.len[1] + myInnerFind.pos[1]>
39 :    <cfset x = x + 1>
I just ran this script without a problem, post the exact style sheet you want to parse, perhaps there's something there I missed or didn't account for... but with the above style example it works alright...

<cfset count = 1>
<cfset i = 1>
<cfset mx = len(styleSheet)>
<cfset myArray2 = arrayNew(2)>
<cfloop condition="count lte mx">
 <cfset myFind = reFindNoCase("(\s*[^\}]+\s*)(\{{1})([^\}]*)(\}{1}\s*)",styleSheet,count,true)>
 <cfset myArray2[i][1] = trim(mid(styleSheet,myFind.pos[2],myFind.len[2]))>
 <cfset myStyles = trim(mid(styleSheet,myFind.pos[4],myFind.len[4]))>
 <cfset myArray2[i][2] = structNew()>
 <cfset start = 1>
 <cfset x = 1>
 <cfset ix = len(myStyles)>
  <cfloop condition="start lte ix">
   <cfset myInnerFind = reFindNoCase("[a-z\-]+\:{1}\s?[^\;]+\;{1}",myStyles,start,true)>
   <cfset myArray2[i][2]['style#x#'] = mid(myStyles,myInnerFind.pos[1],myInnerFind.len[1])>
   <cfset start = myInnerFind.len[1] + myInnerFind.pos[1]>
   <cfset x = x + 1>
  </cfloop>
 <cfset count = myFind.len[1] + myFind.pos[1]>
 <cfset i = i + 1>
</cfloop>

<cfdump var="#myArray2#">

Author

Commented:
Here is what i am using.  I am not sure what could be ...

.RandyBasicText {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;    
line-height: 14px;    
font-weight: normal;    
color: #000000;        
}
.RandyBoldText {    
font-family: Verdana, Arial, Helvetica, sans-serif;    
font-size: 12px;     line-height: 14px;    
font-weight: bold;    
color: #000000;
}
.RandyBasicText {    
 font-family: Verdana, Arial, Helvetica, sans-serif;    
 font-size: 12px;    
 line-height: 14px;    
 font-weight: normal;    
  color: #000000;
  }

Author

Commented:
Any more updates on this?
sure I'll have a look, I have an idea on what it might be...
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.