I'm totally new in the world of coding, so I got lost in a tiny project I created for myself to practice. I would like to create a very simple web page where there would be an input field.
- To the imput field I want to copy a URL
https://kalamajka.aa1.anythig.com/ert/eer/ui/eerr/dda1d
- There should be a function to remove https:// and /ert/eer/ui/eerr/dda1d
In Excel, I created this function which is searching for the first 3 '/' and getting the substring'kalamajka.aa1.anythig.com':
=IFERROR(MID(B2, FIND(CHAR(1),SUBSTITUTE(B2,"/",CHAR(1),2)) 1, FIND(CHAR(1),SUBSTITUTE(B2,"/",CHAR(1),3)) - FIND(CHAR(1),SUBSTITUTE(B2,"/",CHAR(1),2))-1),"Please copy the full url")
Though, I could not find the equivalent for HTML function I could use instead.
- It should be copiable, so I found the following function. }
I have issues adding the result of a function to a function. So, I would like to add result of the substring function (where there's no https and other unnecessary suffixes in the URL) to the clipboard.
- And this is the hardest part: an if-else statement. So, if URL contains aa1, then it should add suffix: /elment/path. Else, add the suffix 'path/toelement':
If statement 1: https://kalamajka.aa1.anythig.com/elment/path If statemenet 2: https://kalamajka.bb1.anythig.com/path/toelement
It looks like in the following way so far:
<meta charset="utf-8">
<style>
div { border: 1px solid red; padding:10px; margin:10px; }
#SACURL { background-color: white; }
</style>
<body>
<div>
<p> Copy the FULL URL </p>
<input id="URL"></input>
<button onclick="GenerateURL()"> Remove prefix and suffix (https) and others </button>
<hr>
<p> Substring URL </p>
<div>
<div id="SubstringURL">
<hr>
URL with no https and suffix should appear here.
</div>
<hr>
<button onclick="CopyURL()"> Copied </button>
</div>
<div>
<div>
If statement (if URL contains aa1), then it should add suffix: elment/path
</div>
<button onclick="OpenURLonNewPage"> Open URL on a new tab </button>
</div>
</div>
</body>
<script>
function GenerateURL() {
var valt1 = document.getElementById("URL").value;
<!-- alert(valt1); -->
document.getElementById("SubstringURL").innerHTML = valt1;
}
function CopyURL() {
/* Get the text field */
var copyText = document.getElementById("<meta charset="utf-8">
<style>
div { border: 1px solid red; padding:10px; margin:10px; }
</style>
<body>
<div>
<p> Copy the FULL URL </p>
<input id="URL"></input>
<button onclick="GenerateURL()"> Remove prefix and suffix (https) and others </button>
<hr>
<p> Substring URL </p>
<div>
<div id="SubstringURL">
<hr>
URL with no https and suffix should appear here.
</div>
<hr>
<button onclick="CopyURL()"> Copied </button>
</div>
<div>
<div>
If statement (if URL contains aa1), then it should add suffix: elment/path
</div>
<button onclick="OpenURLonNewPage"> Open URL on a new tab </button>
</div>
</div>
</body>
<script>
function GenerateURL() {
var valt1 = document.getElementById("URL").value;
<!-- alert(valt1); -->
document.getElementById("SubstringURL").innerHTML = valt1;
}
function CopyURL() {
/* Get the text field */
var copyText = document.getElementById("GenerateSACURL").value;
/* Copy the text inside the text field */
navigator.clipboard.writeText(copyText.value);
/* Alert the copied text */
alert("Copied the text: " copyText.value);
}
function OpenURLonNewPage() IF STATEMENT FOR PREFIX AND SUFIX{
}
</script>Could you please help me understand the logic? I seem to fail every time with it. Also it's not clear how a function's result can be used in another function. How can I reference that?
I would be really grateful for your help! :)
Thanks, Adam
CodePudding user response：
You should be able to get the website endpoint using the below code
var myurl = "https://kalamajka.aa1.anythig.com/ert/eer/ui/eerr/dda1d"
myurl.split('/')[2];
result 'kalamajka.aa1.anythig.com'
you can try running the code in chrome console
CodePudding user response：
The first issue is in your HTML. Your function says OpenURLonNewPage without the required ().
Yours: <button onclick="OpenURLonNewPage">
What It Should Be: <button onclick="OpenURLonNewPage()">
Below is a script that would work for this. I intentionally broke this out so it is easier to understand since you are a beginner.
The GenerateURL function removes the "https://" from the URL and generates a new URL based of your If/Else requirements.
The CopyURL function then strips off the end of the URL to provide you with a copied URL without the path at the end after .com.
The OpenURLonNewPage function takes your generated URL from the GenerateURL function and opens it in a new tab. Note: "http://" had to be added in order for the browser to know you want to open a website. Otherwise, it would attempt to open a local file.
<script>
function GenerateURL() {
var valt1 = document.getElementById("URL").value;
valt1 = valt1.replace('https://', '');
if (valt1.indexOf("aa1")>= 0) {
valt1 = valt1.split('/')[0];
valt1 = valt1 "/element/path"
}
else {
valt1 = valt1.split('/')[0];
valt1 = valt1 "/path/toelement"
}
console.log("Stripped URL: " valt1)
return valt1;
}
function CopyURL(valt1) {
var copy = GenerateURL(valt1);
copy = copy.split("/")[0];
navigator.clipboard.writeText(copy);
console.log("Copied Url: " copy)
}
function OpenURLonNewPage(valt1) {
var newUrl = GenerateURL(valt1);
window.open('http://' newUrl, '_blank')
}
</script>
Hope this is what you were looking for! :)