{"id":18378170,"url":"https://github.com/csp02/html-methods","last_synced_at":"2025-04-06T22:32:11.292Z","repository":{"id":176455597,"uuid":"426675125","full_name":"CSP02/HTML-methods","owner":"CSP02","description":"A package that can handle methods in html(for non repetative code).","archived":false,"fork":false,"pushed_at":"2022-03-26T13:41:36.000Z","size":448,"stargazers_count":6,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-22T07:24:48.183Z","etag":null,"topics":["htmlmethods","methods","methods-in-html"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/CSP02.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-11-10T15:27:57.000Z","updated_at":"2022-03-26T13:40:11.000Z","dependencies_parsed_at":null,"dependency_job_id":"2df7c4b9-4e7f-4e93-93de-780019cbd085","html_url":"https://github.com/CSP02/HTML-methods","commit_stats":null,"previous_names":["csp02/html-methods"],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CSP02%2FHTML-methods","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CSP02%2FHTML-methods/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CSP02%2FHTML-methods/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CSP02%2FHTML-methods/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/CSP02","download_url":"https://codeload.github.com/CSP02/HTML-methods/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247563901,"owners_count":20958971,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["htmlmethods","methods","methods-in-html"],"created_at":"2024-11-06T00:31:47.455Z","updated_at":"2025-04-06T22:32:11.283Z","avatar_url":"https://github.com/CSP02.png","language":"JavaScript","readme":"![Methods](https://github.com/Chandra-sekhar-pilla/HTML-methods/blob/main/Resources/Methods.png)\n\n# HTML methods\n A package that can handle methods in html(for non repetative code).\n\n# What is Methods?\n Have you ever get frustated of writing the same code in html to get what you want. Then here you are use this package? to make it easy by defining your method using a **\"def\"** tag and **\"name\"** attribute to name your method.\n\n# Version info:\n - Methods class - Added because the import is not working when ``window.onload`` is used in the user script because Methods.js uses the same event.\n - Organised the folder structure\n - As Methods class is available user can access in their own script only when using ``window.onload`` event. If the event is not used in user script there is no need to access the class they can just link methods.js and can use import tags. For more info visit [docs](https://the-atelier.ml/Pages/Methods/methods.html)\n# Usage:\n**Using on same file (``\u003cdef\u003e``):**\n - Methods package is very simple to use.\n - All you need to do is to define the method using **\"def\"** tag and **\"name\"** attribute.\n - And then to call the method you can use the value you provided in name attribute.\n - That's it.\n\n**Example**\n```html\n\u003ctest\u003e\u003c/test\u003e\n\u003ccommit\u003e\u003c/commit\u003e\n\u003c!--use the method name as the tag name--\u003e\n\u003cdef name=\"test\"\u003e\n    \u003cp\u003eHelp\u003c/p\u003e\n\u003c/def\u003e\n\u003cdef name=\"commit\"\u003e\n    \u003cp\u003ecommit\u003c/p\u003e\n\u003c/def\u003e\n```\n**Note: You can copy any code that means if you want to copy the code which is at the bottom it will work.**\n\n**Usage on other files (``\u003cimport\u003e``):**\n- Defining of the tags can be done as usual (use the syntax shown in index.html).\n- Now use the instruction\n```html\n\u003cimport name=\"methodName\" from=\"pathToTheSourceFile\"\u003e\n```\n- The attribute ``name`` is the name of the tag and ``from`` is the path to that file\n**Example:**\n\u003e index.html\n```html\n\u003cdef name=\"test\"\u003e\n    \u003cp\u003eMethods.js\u003c/p\u003e\n\u003c/def\u003e\n```\n\u003e anotherHtml.html\n```html\n\u003cimport name=\"test\" from=\"index.html\"\u003e\n```\n- This will automatically imports and includes the inner content of the def tags (methods) from index.html into anotherHtml.html file\n\n**NOTE: You have to include the Methods.js script in every file in which you are using ``\u003cdef\u003e`` and ``import`` tags.**\n\n**NOTE: You can view index.html, anotherHtml.html and other html files in this repository to know more about the usage of Methods.js**\n\n## NOTE:\n- Remember that these def tags will be removed once the page is loaded so that you cannot see the code inside this def tags\n- So the code inside these tags only works once you call them using as a tag name\n- Run [index.html](https://github.com/Chandra-sekhar-pilla/HTML-methods/blob/main/index.html) file and inspect the changes in html so you can know more.\n\n# Output:\n ![MethodsOutput](https://github.com/Chandra-sekhar-pilla/HTML-methods/blob/main/Resources/outPutv2.png)","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcsp02%2Fhtml-methods","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcsp02%2Fhtml-methods","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcsp02%2Fhtml-methods/lists"}