Communities

Writing
Writing
Codidact Meta
Codidact Meta
The Great Outdoors
The Great Outdoors
Photography & Video
Photography & Video
Scientific Speculation
Scientific Speculation
Cooking
Cooking
Electrical Engineering
Electrical Engineering
Judaism
Judaism
Languages & Linguistics
Languages & Linguistics
Software Development
Software Development
Mathematics
Mathematics
Christianity
Christianity
Code Golf
Code Golf
Music
Music
Physics
Physics
Linux Systems
Linux Systems
Power Users
Power Users
Tabletop RPGs
Tabletop RPGs
Notifications
Mark all as read
Q&A

Move to the edit webpage of a webpage via the keyboard with vanilla JavaScript

+4
−0

The webpage example.com has an edit webpage (from which one can edit example.com itself).

example.com/index.php?title=עמוד_ראשי&action=edit

I want that after I click ALT+Shift+E, I would immediately be transferred to that edit page.


What console command could I run to move myself from example.com to example.com's edit page?

I didn't figure out a code but I assume that such code would be very similar to this:

let domain = window.location.hostname;
let h1 = document.getElementsByTagName("h1");
window.addEventListener('keydown', function(event) {
  if (event.altKey && event.shiftKey && event.key === 'e') {
    window.location.href === "domain?title=h1&action=edit"
  }
});
Why does this post require moderator attention?
You might want to add some details to your flag.
Why should this post be closed?

0 comment threads

1 answer

+3
−0

You're getting close, just need a few adjustments.

Instead of using the hostname property, I prefer to use host, because it also includes the port (in case the URL has one) - check the documentation for more info.

You should also get the protocol (which can be http, https, etc), to build the full URL. Without it, you might not get what you want: suppose the current page is https://software.codidact.com/posts/286256. If I run this code:

let domain = window.location.host;
window.location.href = domain + '?abc=1';

The result will be the URL https://software.codidact.com/posts/software.codidact.com?abc=1. Only by including the protocol at the beggining (before the domain), I get the correct URL (https://software.codidact.com/?abc=1).

To set the URL you should use =, not === (the difference is explained here).

Not sure how you're using the h1 element, I guess you wanted to get its text? I included an example below, that gets the innerText property, which contains whatever text is inside the h1 tag.

And finally, when the shiftKey property is set, the corresponding key will be uppercased, so instead of checking for e, you actually should check for E.

The final code:

let domain = window.location.host;
let protocol = window.location.protocol;
let h1 = document.querySelector("h1");
window.addEventListener('keydown', function(event) {
    if (event.altKey && event.shiftKey && event.key === 'E') {
        window.location.href = `${protocol}//${domain}?title=${h1.innerText}&action=edit`;
    }
});

Note that I used template strings to put the variables values inside a single string. Note that the delimiter is the character ` - you're using double quotes, so "domain?title=h1&action=edit" doesn't put the value of the domain variable in the string (instead, it puts the word "domain", which is not what you want).

But you could also use old-style concatenation:

window.location.href = protocol + '//' + domain + '?title='+ h1.innerText + '&action=edit';
Why does this post require moderator attention?
You might want to add some details to your flag.

1 comment thread

Interesting to know with `let h1 = document.getElementsByTagName("h1");` I got "Undefined" as article... (2 comments)

Sign up to answer this question »

This community is part of the Codidact network. We have other communities too — take a look!

You can also join us in chat!

Want to advertise this community? Use our templates!

Like what we're doing? Support us! Donate