Archive for the ‘HTML’ Category
Posted by jpluimers on 2023/11/23
I wish I had known this ages ago: [Wayback/Archive] javascript – Chrome debugging – break on next click event – Stack Overflow (thanks [Wayback/Archive] D.R. for asking and [Wayback/Archive] Konrad Dzwinel for answering):
What you are looking for are [Wayback/Archive] ‘Event Listener Breakpoints‘ on the Sources tab. These breakpoints are triggered whenever any event listener, that listens for chosen event, is fired. You will find them in the Sources tab. In your case, expand ‘Mouse’ category and choose ‘Click’.
Read the rest of this entry »
Posted in Chrome, Chrome, Development, Google, HTML, HTML5, JavaScript/ECMAScript, Power User, Scripting, Software Development, Web Browsers, Web Development | Leave a Comment »
Posted by jpluimers on 2023/09/27
For my link archive is the below answer that should help me a lot with unfinished bits from Some JavaScript bookmarklets for WordPress published pages centered around navigation and IDs.
Goal of that post was to have some grounding and eventually find a means to build an HTML page in a new tab using a bookmarklet that I then later could post to my blog.
Assembling to HTML and putting it on the clipboard might be a lot easier and better fitting in my workflow.
So, via [Wayback/Archive] javascript copy html to clipboard – Google Search, for my link archive: [Wayback/Archive] Javascript – Copy string to clipboard as text/html – Stack Overflow (thanks [Wayback/Archive] Loilo for answering and [Wayback/Archive] kofifus for asking):
Below is a function that will do exactly that. I tested it with your required browsers, it works in all of them. However, IE 11 will ask for confirmation on that action.
Explanation how this works can be found below, you may interactively test the function out in this jsFiddle.
Read the rest of this entry »
Posted in Chrome, Development, Firefox, HTML, HTML5, Internet Explorer, JavaScript/ECMAScript, JSFiddle, Power User, Scripting, Software Development, Web Browsers, Web Development | Leave a Comment »
Posted by jpluimers on 2023/09/20
As I promised a few months back in Bookmarklets for Archive.is and the WayBack Machine to go to the original page, moar JavaScript fiddling, this time with XPath based bookmarklets to navigate from Archive.is pages to Saved From, Redirected from, Via and Original pages.
An alternative would be using XPath as the additional fields are always structured in a table like the html below (taking complex pages like https://archive.ph/5iVVH and https://archive.ph/2015.11.14-044109/http://www.example.org/ as an example).
I got triggered to using XPath from this answer from [Wayback/Archive] gdyrrahitis at [Wayback/Archive] Javascript .querySelector find by innerTEXT – Stack Overflow (thanks [Wayback/Archive] passwd for asking):
Read the rest of this entry »
Posted in Agile, Bookmarklet, Code Quality, Code Review, Development, HTML, JavaScript/ECMAScript, Power User, Scripting, Software Development, Web Browsers, Web Development, XML/XSD, XPath | Leave a Comment »
Posted by jpluimers on 2023/09/15
As promised yesterday, I updated the scripts for Some JavaScript bookmarklets for WordPress published pages centered around navigation and IDs
Code (which broke at 20230914 because of WordPress.com changes: the undocumented HighlanderComments structure got removed; I will update the gist later on and post an updated blog post)
Instead of the undocumented HighlanderComments structure, I now use two (also undocumented) link rel elements.
In addition, I found this element that will be interesting in the future: <link rel='shortlink' href='https://wp.me/pvelJ-m8g' />.
You can view the change with the below archivals of the Wayback Machine and Archive.is.
And of course I learned a few things from these MDN entries:
The 20230530 archivals (Wayback/Archive) of wiert.me/2022/02/14/philosophy-of-management have this HighlanderComments structure:
Read the rest of this entry »
Posted in Bookmarklet, Conference Topics, Conferences, Development, Event, HTML, JavaScript/ECMAScript, Power User, Scripting, SocialMedia, Software Development, Web Browsers, Web Development, WordPress | Leave a Comment »
Posted by jpluimers on 2023/08/16
Cool that Amnesty International can do a YouTube [Wayback/Archive] Extract Meta Data (Amnesty International).
Via:
I wonder if I can write a Bookmarklet for this (it will likely require an HTTP POST request).
–jeroen
Posted in Development, HTML, JavaScript/ECMAScript, LifeHacker, Power User, Privacy, Scripting, SocialMedia, Software Development, Web Development, YouTube | Leave a Comment »
Posted by jpluimers on 2023/07/18
I forgot to post this: [Wayback/Archive] Which characters need to be escaped in HTML? – Stack Overflow
& becomes &
< becomes <
> becomes >
I didn’t quote further, as this bit is somehow important for WordPress posts. WordPress reminded me the hard way when initially these posts were wrongly titled:
Warning:
It also means the “Press This” bookmarklet always gets unescaped plain text wrong. Watch this when selecting text for blogging and check if the selected text actually got into your post fine.
Thanks [Wayback/Archive] Ahmet for asking the above question and [Wayback/Archive] Jeremy for answering it.
–jeroen
Posted in Development, HTML, HTML5, SocialMedia, Software Development, Web Development, WordPress, WordPress | Leave a Comment »
Posted by jpluimers on 2023/07/05
In Another difference between the and element in HTML&XHTML, I mentioned Stephan Kämper taught be about the W3C HTML NU validator in [Archive] Stephan Kämper on Twitter: “I try to write fairly simple & #valid #HTML ➙ …gist..Validating it with …online HTML-Validator…, I get the error ‘No p element in scope but a p end tag seen.‘ What? Why? Removing the list from the HTML, gets rid of the error… Why?!? I. don’t. get it. 1/2″ / Twitter.
Upon closer inspection, there are actually two w3c.org HTML validators, each operating in three modes:
- Default checker which is DTD-based:
This validator checks the [Wayback/Archive] markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc. If you wish to validate specific content such as [Wayback/Archive] RSS/Atom feeds or [Wayback/Archive] CSS stylesheets, [Wayback/Archive] MobileOK content (now retired), or to [Wayback/Archive] find broken links, there are [Wayback/Archive] other validators and tools available. As an alternative you can also try our [Wayback/Archive] non-DTD-based validator.
- [Wayback/Archive] The W3C Markup Validation Service:
#validate_by_uri mode (without #validate_by_uri URL fragment) and
default: checks the HTML of a URL
- [Archive] The W3C Markup Validation Service: #validate_by_upload mode
you upload a file of which the HTML then gets checked
- [Archive] The W3C Markup Validation Service: #validate_by_input mode
you enter the HTML to be checked into a text box
- NU checker which is non-DTD-based:
- [Wayback/Archive] Ready to check – Nu Html Checker;
#address mode (without #address URL fragment) and
default: checks the HTML of a URL
- [Archive] Ready to check – Nu Html Checker:
#file mode
you upload a file of which the HTML then gets checked
- [Archive] Ready to check – Nu Html Checker:
#textarea mode
you enter the HTML to be checked into a <textarea> element
Notes:
- that all three above modes get selected by a URL fragment (after a
# hash) which the Wayback machine cannot individually save, but Archive.is can, hence the non-default URLs are not saved only in Archive.is, and not in the Wayback machine.
- The DTD-based checker seems non-functional and redirects all requests to the non-DTD-based checker.
I also took a look at the Wayback machine saved pages under the direct URLs of both checkers:
- https://web.archive.org/web/*/https://validator.w3.org/*
- https://web.archive.org/web/*/https://validator.w3.org/nu/*
I learned that the NU validator accepts at least these arguments:
Note that you cannot do this directly with HTML files saved in a gist or GitHub repository because it serves all RAW files as
[Wayback/Archive] text/plain MIME type. You can work around this by using a raw.githack.com trick I explained before at:
I also amended my above reply with more information using the ?doc= parameter with RAW gist files and archived that thread at [Wayback/Archive] Thread by @jpluimers on Thread Reader App – Thread Reader App.
–jeroen
Posted in Development, HTML, HTML5, Software Development, Web Development | Leave a Comment »
Posted by jpluimers on 2023/07/02
I quickly hacked together this JavaScript Bookmarklet today, so it is without any checks and assumes you have enabled one Mastodon account for publishing, that you are hosting your blog on WordPress.com, and using the Classic Editor:
javascript:(function(){
publicizeFormEditHref = document.getElementById('publicize-form-edit');
publicizeFormEditHref.click();
mastodonCheckboxes = document.getElementsByClassName('wpas-submit-mastodon');
mastodonCheckboxes[0].checked = true;
publicizeFormHideHref = document.getElementById('publicize-form-hide');
publicizeFormHideHref.click();
updateButtonHref = document.getElementById('publish');
updateButtonHref.click();
})();
The above code is the state of [Wayback/Archive] JavaScript Bookmarklet for the WordPress classic editor which enables mastodon publishing (assuming you have one mastodon publishing account enabled … ) and due to be improved in a later blog post.
This will enable the currently edited post to be published to Mastodon, then update/publish the post.
On enabling one Mastodon account for publishing:
Read the rest of this entry »
Posted in Bookmarklet, Development, HTML, JavaScript/ECMAScript, Mastodon, Power User, Scripting, SocialMedia, Software Development, Twitter, Web Browsers, Web Development, WordPress, WordPress | Leave a Comment »
Posted by jpluimers on 2023/06/28
Via [Wayback/Archive.is] inline svg to file – Google Search, found first [Wayback/Archive] Convert Inline SVG to File – Eyedeal Graphics
- Use your browser’s “View Source” or “Page Source” command to view the page’s HTML code.
- Locate and copy all the code between the beginning <svg> and closing </svg> tags.
- Paste the copied code, including the <svg> and </svg> tags into your text editor of choice. (Atom, Brackets, Visual Studio Code, Sublime Text, etc.)
- Save the text file as an SVG file. (ex. legacy-xyz-products-logo.svg)
- Open the SVG file in your preferred vector editing tool. (Adobe, Illustrator, Affinity Designer, Sketch, Inkscape, etc.)
That wasn’t enough, as not all SVG files then render properly, so luckily the next hit was [Wayback/Archive] html – Convert an inline SVG into a SVG file – Stack Overflow (thanks [Wayback/Archive] Paul LeBeau):
Read the rest of this entry »
Posted in Development, HTML, HTML5, Software Development, Web Development | Leave a Comment »
The Wiert Corner - irregular stream of stuff 