Develop Reference

correct a bad generated link using Javascript

I have a system that dynamically generates links. but the html links are displayed like this :
Page Example
there's a way to remove the repetition of <a> tags using JS ? so, the link becomes :
Page Example

Let's take a look at your url:
var url='Page Example';
First let's get rid of both occurences of "
url=url.replace(/"/g,'');
Now remove the first occurence of </a> by feeding the exact string instead of a regular expression to the .replace method.
url=url.replace('</a>','');
At this point your url looks like this:
Page Example
We're getting closer. Let's remove anything in between the > and the " by
url=url.replace(/\>(.*)\"/,'"');
which gives us
Page Example
Almost done - finally let's get rid of "<a href=
url=url.replace('"<a href=','"');
To make the whole thing a bit more beautiful we can chain all four operations:
var url = 'Page Example';
url = url.replace(/"/g, '').replace('</a>', '').replace(/\>(.*)\"/, '"').replace('"<a href=', '"');
console.log(url);

Within your process you can use regex to extract the url from the href string:
const string = "<a href="/page-example">Page Example</a>";
const url = string.match(/(\/)[\w-]*(?=&)/)[0];
console.log(url);

Yes, using the string split() function like this...
S='<a href="/page-example">Page Example</a>';
var A=split('"');
document.write(A[1]);
This should display "/page-example", and you can then add it as the href to an anchor.

You can retrieve the hrefvalue that seems to be the correct A element and replace the incorrect one with the correct one:
const a = document.querySelector('a[href]'); //if you have more <a> elements replace it to your need
const attr = a.getAttribute('href'); //get the value of 'href' attribute
const temp = document.createElement('template');
temp.innerHTML = attr; //create the new A element from the 'href' attribute's value
const newA = temp.content.children[0]; //retrieve the new <a> element from the template
a.parentElement.replaceChild(newA, a); //replace the incorrect <a> element with the new one
Page Example

How do I extract the domain with a hash?

I want to extract the domain with a hash without the long random id from the location address bar to make it to show like this:
http://test.example.com/#inbox
Here is the full URL:
http://test.example.com/#inbox/U2FsdGVkX19stSSdMXLZq5v7bOgzRLtaM7Lr1t+lWpI=
Here is what I have tried so far:
var url = location.hash.split('#inbox')[1];
And I have also tried this:
var url = $(location).attr("href").split('/')[2];
Unfortunately, I didn't get what I want to extract the domain and the hash without the long random id.
When I try it, it extracts the domain name and the hash without the random id to get the return output for the URL like http://test.example.com/#inbox.

I would use indexOf() to find the position of the '#' character. Since the URL can't include a '#', it is safe to assume that the first '#' will be the one you're interested in.
Then I would search for the '/', again with indexOf(), so the word between the '#' and the '/' can change and things still work as expected.
That position is the location of the '/' and anything before that can be returned which is what the String.sub() function does and it returns that URL you're looking for:
var pos = location.href.indexOf('#')
pos = location.href.indexOf('/', pos)
var url = location.href.substr(0, pos)
Another way, although I'm not sure whether it's fully portable, is to use the location fields like so:
var url = location.origin + location.pathname + "#inbox"
If the "#inbox" part can change, you may be able to tweak the code or search for a slash in location.hash like so:
var pos = location.hash.indexOf('/')
var url = location.origin + location.pathname + location.hash.sub(0, pos)
Either way should be plenty fast anyway (especially since you won't need to loop over such).

I got the whole URL, found where the "#" is, added 6 to its count for "#" + the word "inbox", and dropped the rest of the URL:
var url = document.URL;
var i = url.indexOf('#') + 6; // 6 is length of "#" + the word "inbox"
var answer = url.substr(0, i);

Try the code below:
// Complete URL
var url = 'http://test.example.com/#inbox/U2FsdGVkX19stSSdMXLZq5v7bOgzRLtaM7Lr1t+lWpI=';
var desiredResult = url.match(/.*\/\#inbox\//)[0];
console.log(desiredResult.substring(0, desiredResult.length - 1)); // this will output 'http://test.example.com/#inbox'

replace certain parameter or entire URL

I need to replace the window URL with a new one based on a checkbox input. I'm trying to do this like so:
// get checkbox value
var selection = $('input[type="checkbox"]:checked').val()
// get current url
var url = window.location.href;
// prefix current URL with checkbox
url += '&site=' + selection + '&page=1';
// debug line
// console.log(url);
// navigate to new URL
location.replace(url);
I have a series of parameters at the end of my URL that looks like:
mywebsite.com&site=main&page=1
I either need to replace the entire URL, or just the parameters below:
&site=main&page=1
The key is in the last line. I've tried a few things this is the output:
Both location.assign(url); and location.replace(url); gives: mywebsite.com&site=main&page=1&site=main&page=1
window.location.href() seems to have the same behavior, it does not replace the entire URL.
What I don't understand is for location.replace() - sanity checking the behavior on reading MDN, it quotes:
The Location.replace() method replaces the current resource with the
one at the provided URL.
Ok, lets do it. Then this happens:
http://mywebsite.com&site=main&page=1&site=main&page=1
Beating to the punch - in the console log - it returns the correct URL parameters. So output in my console looks like:
http://mywebsite.com&site=main&page=1
Why is it not replacing the entire URL with the new one? How do you just replace the entire URL with a new one, or somehow just target the parameters? Regex?

Why not just build the URL you want and set that?
var url = 'http://mywebsite.com?site=' + selection + '&page=1';
location.href = url;
If you don't know what page you are on and that will be dynamic you can do:
var hostAndPath = location.host + location.pathname;
var selection = $('input[type="checkbox"]:checked').val();
var url = hostAndPath + '?site=' + selection + '&page=1';
location.href = url;

Creating a link tag with parameters

Hi i have a link tag that i am creating from javascript. now i want to append a parameters to that link just like below example.so that when the user clicks that button it should go to that url along with the paramenters
var id="123456789";
var data = ' click' ;
this data tag i am appending to some other element.
now i can able to call /order/product. but when i give id also it is giving error "missing arguments"!!
can anyone please help me?

You'll have to unquote the string where the variable goes
var id = "123456789";
var data = ' click' ;
Or on really up-to-date JavaScript engines that support ES2015+ template literals:
var id = "123456789";
var data = ` click`;
But that won't work on any version of IE (does on Edge).

For easy create link you can use method link(str) of String:
var id="123456789";
var linkText = " click";
var href = "/order/product/" + id;
var data = linkText.link(href);
alert(data);

To make it easier both to write and read (and debug too), I'd recommend the following variant of how to organize the code:
var id = "1234566",
// It is more understandable now that hrefLink contains id concatenated with some other string
hrefLink = "/order/product/" + id,
link = document.createElemen('a');
link.href = hrefLink;
In this way you
See what variable means what
Control what your hrefLink consists of
Follow best practises when instead of multiple lines with var statement you explicitly "show" where the declaration section is:
var a = smth1,
b = smth2;
So just by looking at this code you easier understand that that is a code chunk of variables declaration

You just need to remove the quotes from id
just like below
var id="123456789";
var data = ' click' ;
If You have id within quotes means it will take as string not a variable name and so just remove the quotes. It will work

Find Next HTML Document in a Series

I have a series of HTML files in the same directory named: page1.html, page2.html, page3.html, etc. I can identify the name of my current HTML document like this:
var path = window.location.pathname;
var page = path.split("/").pop();
console.log( page );
But now I want to be able to log the next HTML file in the series. So if I am on page2.html, I want to log page3.html. How can I replace that file name, with the next numbered file in my series ?

This should do it with pure javaScript:
var page = window.location.pathname;
console.log(page.replace(/\d+/g, parseInt(page.match(/\d+/g), 10) + 1));
Inner regex takes page number + 1 and the outer one replaces the value with it.

That's quite simple:
page=str.replace("page","");
a=parseInt(page);
a++;
console.log("page"+a+".html");
The first line raplaces the first part so it's "3.html" var. The second gets the integer out of page. What follows is an increment and an output.
That's one of the possibilities how it could be done.
Sources:
str.replace()
parseInt()

Thanks to #Mico and #SugarOnBacon this solution works!
var path = window.location.pathname;
var page = path.split("/").pop();
console.log(page.replace(/\d+/g, parseInt(page.match(/\d+/g), 10) + 1));