https://github.com/handmadeweb/datafetcher.js
dataFetcher.js is a small library to swap the content of an element with the Html content from an ajax response.
https://github.com/handmadeweb/datafetcher.js
Last synced: 11 months ago
JSON representation
dataFetcher.js is a small library to swap the content of an element with the Html content from an ajax response.
- Host: GitHub
- URL: https://github.com/handmadeweb/datafetcher.js
- Owner: HandmadeWeb
- License: mit
- Created: 2021-08-07T22:53:04.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2021-08-11T22:15:38.000Z (over 4 years ago)
- Last Synced: 2025-03-02T07:06:31.388Z (12 months ago)
- Language: JavaScript
- Homepage:
- Size: 402 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
[](LICENSE.md)
dataFetcher.js is a small library to swap the content of an element with the Html content from an ajax response.
## Adding dataFetcher.js to your project
### From cdn.jsdelivr.net
- Add the script to your footer.
```html
```
### Precompiled js file
- Clone or download the library.
- Add `/dist/data-fetcher.min.js` to your project.
### Building from the source
- Clone or download the library.
- Run `npm install` & ( `npm run dev` or `npm run prod` )
- Add `/dist/data-fetcher.min.js` to your project.
## Usage
Load `data-fetcher.min.js` in your footer.
`data-fetcher.js` will look for elements which have a `data-fetcher` data attribute, it will then trigger a GET request to the url specified in the `data-fetcher` attribute, and will replace the contents of the element with the contents of the GET request, so be sure to return a Html response.
If we wanted to fetch the latest news, the below example will do just that.
```html
```
If we wanted to fetch the latest news, but also display some placeholder content until the news has been loaded, then the below example will do that.
```html
Man drops egg, goes without breakfast! You won't believe what happened next!
```
## Changelog
Please see [CHANGELOG](https://github.com/handmadeweb/datafetcher.js/blob/main/CHANGELOG.md) for more information what has changed recently.
## Contributing
Please see [CONTRIBUTING](https://github.com/handmadeweb/datafetcher.js/blob/main/CONTRIBUTING.md) for details.
## Credits
- [Handmade Web & Design](https://github.com/handmadeweb)
- [Michael Rook](https://github.com/michaelr0)
- [John Pieters](https://github.com/sliver37)
- [All Contributors](https://github.com/handmadeweb/datafetcher.js/graphs/contributors)
## License
The MIT License (MIT). Please see [License File](https://github.com/handmadeweb/datafetcher.js/blob/main/LICENSE.md) for more information.