how to provide html/js widget for users
How can I share html/js widget? Javascri开发者_JAVA百科pt, iframe or what way is good?
Now I have html page, css file and js file. I want to share this widget with people so they can attach it to their blogs, websites etc.
Here is a working example using java script.
contents of www.foo.com/test.js:
document.write('<p>some example content</p>');
copy/paste widget for test.js:
<scirpt type="text/javascript" src="http://www.foo.com/text.js"></scirpt>
iFrame for non-technical integration. That way you can just offer them a code snippet to copy and paste.
If your widget is a fixed size, then the iframe approach is probably the most straight forward. If you can offer it via a webservice that can be called from a remote client, that's nicer from a developer perspective, but an iframe is probably what you're looking for. It's how typical banners etc are done.
I would suggest integrating any JS and CSS that you can into your page to reduce the remote calls, if your widget doesn't change a lot... this will help a bit, or at least merge and minify your js and css into a single file each.
You might wanna do something like this...
function addWidget(element){
//Create your widget here
element.innerHTML = {your widget}
}
The function can be called like this
addWidget(document.getElementById("someID"));
Take a look how Google do it with their latest asynchronous code for Google Analytics tracking. Basically it involves your users inserting a short JavaScript snippet in their pages. The snippet dynamically inserts a <script>
element in the HTML page's <head>
element that points to a JS file you've written that creates the requisite HTML.
Google Async code
精彩评论