Skip to content

Latest commit

 

History

History
56 lines (41 loc) · 2.06 KB

README.md

File metadata and controls

56 lines (41 loc) · 2.06 KB

pageSnippets

pageSnippets is a JavaScript tool for dynamically and easily creating complex HTML or XML. Outsource parts of your big and confusing HTML and generate them on demand. No more need for messy nested document.createElement(), just code your HTML and produce() the snippets.

ECMAScript6
Standalone
License

Example

This short example to gives you a glimpse how easy it is to use pageSnippets.

  1. Compose your snippets as an XML file:
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<ps:pagesnippets xmlns:ps="https://github.com/suppenhuhn79/pagesnippets">
  <ps:snippet name="hello">
    <h1>Hello world!</h1>
  </ps:snippet>
</ps:pagesnippets>
  1. Include pageSnippets2.js in your HTML file. (Note that the previous version 'pageSnippets.js' is deprecated and will be discontinued.)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>pageSnippets Demo</title>
		<meta charset="utf-8" />
		<script src="https://suppenhuhn79.github.io/pagesnippets/pagesnippets2.js"></script>
	</head>
</html>
  1. Have a short script that imports the snippet file. Produce the snippet and place it in the document.
  <body>
    <script>
      pageSnippets.import("snippet.xml").then(() => document.body.appendChild(pageSnippets.produce("hello")));
    </script>
  </body>
</html>

You're done.

Of course there's more! Unleash its full power with placeholders, conditions, lists and much more. Find a full reference in the wiki.

Licence

pageSnippets is licensed under the Apache License, Version 2.0.