https://github.com/cssobj/cssobj-helper-showcss
Show css text from style tag, style id, chrome dev tools, or cssobj result.
https://github.com/cssobj/cssobj-helper-showcss
Last synced: about 2 months ago
JSON representation
Show css text from style tag, style id, chrome dev tools, or cssobj result.
- Host: GitHub
- URL: https://github.com/cssobj/cssobj-helper-showcss
- Owner: cssobj
- License: mit
- Created: 2016-12-03T01:05:58.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2018-03-21T08:37:31.000Z (about 8 years ago)
- Last Synced: 2025-10-20T05:51:02.341Z (8 months ago)
- Language: JavaScript
- Size: 10.7 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# cssobj-helper-showcss
Show css text from style tag, style id, chrome dev tools, or **cssobj result**.
## **Install**
- **include in html**
``` html
// showcss function is now available
```
- **bookmarklet**
In Chrome, press Ctrl+D, popup the favorite dialog, click **Modify**, paste in **URL** as below:
``` javascript
javascript:showcss=function(){"use strict";function e(e){return function(t){if("string"==typeof t&&(t=document.getElementById(t)),"object"==typeof t&&t&&t.cssdom&&(t=t.cssdom),(t=t||$0)&&"STYLE"==t.tagName){var s=t.sheet||t.styleSheet;if(s.cssText)return s.cssText;for(var n="",r=s.cssRules||s.rules,c=0,o=r.length;c` tag:
``` javascript
showcss()() // console.log the last selected style
showcss(console.log)($0) // totally same as above
showcss(alert)('tagID') // alert style of tagID
// write the css into html
showcss(csstext => div.innerHTML = csstext )(dom)
// show css from cssobj, with each UPDATE
cssobj(obj, {onUpdate: showcss( csstext => div.innerHTML = csstext )})
```
## API
### showcss (callback: (string)->any ) (source: dom|string|result|any) -> any
Display css text from **source**, and call **callback** with the text.
### **callback** can be
- empty: will use `console.log` as callback, means output css text into console.
- function: will call the function with `callback(str)`, and return the result
#### **source** can be
- empty: last selected style tag from DevTools
- string: style tag ID
- dom: style tag dom
- result: cssobj result object