Javascript get base url

How to get base url with jquery or javascript?

With your given example: Solution 3: Base URL in JavaScript Here is simple function for your project to get base URL in JavaScript. Solution 2: I think this will work well for you: Solution 3: This will get base urlSolution 4: returns Base URL also respecting the value in tag https://developer.mozilla.org/en-US/docs/Web/API/Node/baseURI Question: I am building a website with CodeIgniter, I have various resources that I load with the base_url helper function like this which produces (i.e. www.mysite.com)

How to get base url with jquery or javascript?

In joomla php there I can use $this->baseurl to get the base path, but I wanted to get the base path in jquery.

The base path may be any of the following example:

http://www.example.com/ http://localhost/example http://www.example.com/sub/example 

The example may also change.

var getUrl = window.location; var baseUrl = getUrl .protocol + "//" + getUrl.host + "/" + getUrl.pathname.split('/')[1]; 

I think this will work well for you:

var base_url = window.location.origin; var host = window.location.host; var pathArray = window.location.pathname.split( '/' ); 

var baseurl = window.location.origin+window.location.pathname; 

document.baseURI returns Base URL also respecting the value in tag https://developer.mozilla.org/en-US/docs/Web/API/Node/baseURI

In DNN, how to get base URL in Javascript Files, In DNN, how to get base URL in Javascript Files. Ask Question Asked 5 years, 5 months ago. Modified 5 years, 5 months ago. Viewed 433 times …

How to get the base url in javascript

I am building a website with CodeIgniter, I have various resources that I load with the base_url helper function like this

which produces (i.e. www.mysite.com)

I can then swap this resource with another in javascript like this

$(‘#style_color’).attr(«href», «assets/css/themes/» + color_ + «.css»);

what happens is that it will try to load the resource without using the absolute path generated by php, so my solution was adding a dummy tag in every page with php like this

I then modified the javascript line to

$(‘#style_color’).attr(«href», $(‘#base_url’).attr(«class») + «assets/css/themes/» + color_ + «.css»);

it does work but it doesn’t look elegant at all, so, I would appreciate any help on how to maybe generate this Base Url from within javascript or any other solution, thanks 🙂

I preferred a Javascript only solution and since I am using CodeIgniter, a document.base_url variable with the segments of the url from the protocol to the index.php seemed handy

with the function base_url() being

Base URL in JavaScript

You can access the current url quite easily in JavaScript with window.location

You have access to the segments of that URL via this locations object. For example:

// This article: // https://stackoverflow.com/questions/21246818/how-to-get-the-base-url-in-javascript var base_url = window.location.origin; // "http://stackoverflow.com" var host = window.location.host; // stackoverflow.com var pathArray = window.location.pathname.split( '/' ); // ["", "questions", "21246818", "how-to-get-the-base-url-in-javascript"] 

In Chrome Dev Tools, you can simply enter window.location in your console and it will return all of the available properties.

Further reading is available on this Stack Overflow thread

One way is to use a script tag to import the variables you want to your views:

Here, I wrapped the base_url with json_encode so that it’ll automatically escape any characters to valid Javascript. I put base_url to the global Window so you can use it anywhere just by calling base_url, but make sure to put the script tag above any Javascript that calls it. With your given example:

. $('#style_color').attr("href", base_url + "assets/css/themes/" + color_ + ".css"); 

Base URL in JavaScript

Here is simple function for your project to get base URL in JavaScript.

// base url function base_url() < var pathparts = location.pathname.split('/'); if (location.host == 'localhost') < var url = location.origin+'/'+pathparts[1].trim('/')+'/'; // http://localhost/myproject/ >else < var url = location.origin; // http://stackoverflow.com >return url; > 

var baseTags = document.getElementsByTagName("base"); var basePath = baseTags.length ? baseTags[ 0 ].href.substr( location.origin.length, 999 ) : ""; 

Javascript — How to get base URL in Google Chrome, I just got the solution. What was happening is that instead of giving me the base URL, the window.location.origin was giving me the origin URL where it is hosted …

How to get the base url on javascript?

I have a page that is available on address below
http://localhost/foo/test/index.html
and
http://localhost/foo/test
(without back slash)

I can place a css file in the parent directory ( http://localhost/foo/test/style.css ) and add it on the page with

and browser will successfully load the style sheet.

If we look at window.location , it’s http://localhost/foo/test/index.html on the first reference and http://localhost/foo/test on the second reference (i.e. we have an additional path element in the end of the first url and don’t have it in the second one).

How does a browser know, that he should make a request to http://localhost/foo/style.css to get style sheet content in both cases? And how can I get this base url with client-side javascript (or know that test is a directory and not a file)?
For example if I want to know that requests to http://localhost/foo/style.css and ../style.css are the same.

Notice: I can’t use server side code for it.

UPD : There is an error in the question. Browser doesn’t correctly load the style sheet from url without a slash on the end. Thank you!

Not a full answer for sure but on JS side try window.location object

window.location.href returns the href (URL) of the current page

window.location.hostname returns the domain name of the web host

window.location.pathname returns the path and filename of the current page

window.location.protocol returns the web protocol used (http: or https:)

window.location.assign() loads a new document

You can get base URL of current site by using JavaScript Window Object

console.log(window.location.origin) //gives the current url

How do I extract the base URL from a link-string with, Browse other questions tagged javascript jquery url url-parameters or ask your own question. The Overflow Blog Skills that pay the bills for software …

How to get base URL of an MVC application using javascript

How do I get the base URL using javascript?

E.g., When I browse my site from visual studio, and if my URL is http://localhost:20201/home/index , I would want to get http://localhost:20201

If I host my site on IIS, and if my virtual directory name is MyApp and the URL is http://localhost/MyApp/home/index , I would want to get http://localhost/MyApp

I tried using location.protocol + location.hostname (and location.host ), they work fine when i browse my site via visual studio, but when I host it on IIS, I get http://localhost , the /MyApp is truncated off.

You should avoid doing such detection in JavaScript and instead pass the value from the .NET code. You will always risk running into problems with urls like http://server/MyApp/MyApp/action where you cannot know which is the name of a controller and which the path to the application.

In your Layout.cshtml file (or wherever you need it) add the following code:

The new Uri() part is needed so that the URL is always combined correctly (without manually checking if each part starts or ends with / symbol).

If you are using .NET Core, you can get url setting a JavaScript variable in a global scope (For example in Layout.cshtml File, this file is in the folder Views/Shared):

From version C# 6 with interpolation:

var url = window.location.href.split('/'); var baseUrl = url[0] + '//' + url[2]; 

function getBaseURL() < var url = location.href; // entire url including querystring - also: window.location.href; var baseURL = url.substring(0, url.indexOf('/', 14)); if (baseURL.indexOf('http://localhost') != -1) < // Base Url for localhost var url = location.href; // window.location.href; var pathname = location.pathname; // window.location.pathname; var index1 = url.indexOf(pathname); var index2 = url.indexOf("/", index1 + 1); var baseLocalUrl = url.substr(0, index2); return baseLocalUrl + "/"; >else < // Root Url for domain name return baseURL + "/"; >> document.write(getBaseURL()); 

How to extract base URL from a string in JavaScript?, JavaScript: How to get an absolute Base-URL? 0. How to get the text after the # symbol in a link? 1. How o get site URL on server using javascript. …

Источник

5 Ways to Obtain the Base URL or Base Path in JavaScript and jQuery

Learn how to obtain the base URL or base path in JavaScript and jQuery using window.location, attr() method, document.baseURI, tag, and URL() Web API. Improve your web development skills today!

• Obtaining the Base URL using window.location object
• Setting or Obtaining the Base URL in jQuery using attr() method
• JavaScript : How to get base url with jquery or javascript?
• Obtaining the Base URL using document.baseURI property
• Specifying the Base URL using tag
• Using URL() Web API to Obtain or Manipulate URLs
• Obtaining the Current URL using the ‘href’ property in jQuery
• Other code examples for obtaining the base URL in jQuery
• Conclusion
• How to get base URL in JavaScript?
• How do I get the base URL in HTML?
• How to get the domain URL in jQuery?
• How to split base URL in JavaScript?

As a web developer, you may need to obtain the base URL or base path of a website for various reasons such as setting up relative URLs, redirecting users to another page or resource, or simply for debugging purposes. In this article, we will explore five different ways to obtain the base URL or base path in JavaScript and jQuery.

Obtaining the Base URL using window.location object

The window.location object provides information about the current URL, including the protocol, hostname, port number, pathname, and hash. To obtain the base URL, we can combine the protocol, hostname, and port number properties.

const baseUrl = window.location.protocol + "//" + window.location.hostname + ":" + window.location.port; 

By concatenating these properties, we can obtain the base URL of the website. This method is simple and does not require any external libraries or plugins.

Setting or Obtaining the Base URL in jQuery using attr() method

The attr() method in jQuery is used to set or obtain attributes of HTML elements. To set or obtain the base URL of a website using jQuery, we can use the attr() method on the base tag.

const baseUrl = $('base').attr('href'); 

Alternatively, we can also set the base URL using the same method.

$('base').attr('href', 'http://example.com/'); 

This method is useful when we need to set or obtain the base URL dynamically.

JavaScript : How to get base url with jquery or javascript?

JavaScript : how to get base url with jquery or javascript ? [ Gift : Animated Search Engine Duration: 1:25

Obtaining the Base URL using document.baseURI property

The document.baseURI property returns the absolute base URL of the document. This property is read-only and cannot be modified.

const baseUrl = document.baseURI; 

This method is useful when we need to obtain the base URL of an external resource such as an iframe.

Specifying the Base URL using tag

The tag is used to specify the base URL for all relative URLs on a website. We can specify the base URL by adding the href attribute to the tag.

head> base href="http://example.com/"> head> 

By specifying the base URL using the tag, all relative URLs on the website will be relative to the specified base URL. This method is useful when we need to set the base URL for the entire website.

Using URL() Web API to Obtain or Manipulate URLs

The URL() Web API is a powerful tool for obtaining or manipulating URLs. We can use the URL() constructor to create a URL object from a string URL.

const url = new URL(window.location.href); const baseUrl = url.origin; 

By using the origin property of the URL object, we can obtain the base URL of the website. Additionally, we can also manipulate the URLs using the URL() Web API.

Obtaining the Current URL using the ‘href’ property in jQuery

The href property in jQuery is used to obtain the current URL of the page.

const currentUrl = $(location).attr('href'); 

By using the location object in jQuery, we can obtain the current URL of the page. This method is useful when we need to obtain the current URL for redirecting users or for debugging purposes.

Other code examples for obtaining the base URL in jQuery

In Javascript , for example, jquery get base url code example

console.log(window.location.origin);

Conclusion

In this article, we explored five different ways to obtain the base URL or base path in JavaScript and jQuery. By using these methods, we can set up relative URLs, redirect users to other pages or resources, or simply for debugging purposes. It is important to understand how to obtain the base URL or base path in web development as it is a fundamental concept that is frequently used. By continuing to learn about web development and URL manipulation, you can become a more proficient web developer.

Источник