How to get base url in jQuery?
Think I am in http://localhost/test/test_controller/test's js file then I want to get only
/test
or
http://localhost/test/
You dont actually need to use jQuery. JavaScript provides this for you
var l = window.location;
var base_url = l.protocol + "//" + l.host + "/" + l.pathname.split('/')[1];
You can also use this custom method :
// it will return base domain name only. e.g. yahoo.co.in
function GetBaseUrl() {
try {
var url = location.href;
var start = url.indexOf('//');
if (start < 0)
start = 0
else
start = start + 2;
var end = url.indexOf('/', start);
if (end < 0) end = url.length - start;
var baseURL = url.substring(start, end);
return baseURL;
}
catch (arg) {
return null;
}
}
If you're getting the current page's url, check out the link object.
You'll probably want document.hostname or document.host.
If your looking for the hostname of a link inside the document, see this conversation
Related
I am using a javascript on my site, which always inherits the UTM parameters to the links on the site.
However, this is not working, when the links are anchor links to a section of the site and the link the visitor used to visit the page contains the "gclid" parameter from google.
For example:
A visitor uses this link to visit a site:
domain.com?utm_source=test&utm_medium=test&utm_campaign=test&gclid=12345
The button link on the site with the anchor link will look like the following:
domain.com&gclid=12345?utm_source=test&utm_medium=test&utm_campaign=test#anchor
For some reason the "&gclid" part changes its position.
I've tested it with a link without an anchor and in this case the "gclid" parameter doesn't get inherited and the link works.
Of course, the second domain isn't working anymore and leads to a 404 error.
Does someone have an idea what could be the cause for this?
This is the javascript I am using to inherit the UTMs:
(function() {
var utmInheritingDomain = "grundl-institut.de"
utmRegExp = /(\&|\?)utm_[A-Za-z]+=[A-Za-z0-9]+/gi,
links = document.getElementsByTagName("a"),
utms = [
"utm_medium={{URL - utm_medium}}",
"utm_source={{URL - utm_source}}",
"utm_campaign={{URL - utm_campaign}}"
];
for (var index = 0; index < links.length; index += 1) {
var tempLink = links[index].href,
tempParts;
if (tempLink.indexOf(utmInheritingDomain) > 0) {
tempLink = tempLink.replace(utmRegExp, "");
tempParts = tempLink.split("#");
if (tempParts[0].indexOf("?") < 0) {
tempParts[0] += "?" + utms.join("&");
} else {
tempParts[0] += "&" + utms.join("&");
}
tempLink = tempParts.join("#");
}
links[index].href = tempLink;
}
}());
EDIT: It seems like the following script don`t causes this problem:
<script>
(function() {
var domainsToDecorate = [
'domain.com',
],
queryParams = [
'utm_medium',
'utm_source',
'utm_campaign',
]
var links = document.querySelectorAll('a');
for (var linkIndex = 0; linkIndex < links.length; linkIndex++) {
for (var domainIndex = 0; domainIndex < domainsToDecorate.length; domainIndex++) {
if (links[linkIndex].href.indexOf(domainsToDecorate[domainIndex]) > -1 && links[linkIndex].href.indexOf("#") === -1) {
links[linkIndex].href = decorateUrl(links[linkIndex].href);
}
}
}
function decorateUrl(urlToDecorate) {
urlToDecorate = (urlToDecorate.indexOf('?') === -1) ? urlToDecorate + '?' : urlToDecorate + '&';
var collectedQueryParams = [];
for (var queryIndex = 0; queryIndex < queryParams.length; queryIndex++) {
if (getQueryParam(queryParams[queryIndex])) {
collectedQueryParams.push(queryParams[queryIndex] + '=' + getQueryParam(queryParams[queryIndex]))
}
}
return urlToDecorate + collectedQueryParams.join('&');
}
// borrowed from https://stackoverflow.com/questions/831030/
// a function that retrieves the value of a query parameter
function getQueryParam(name) {
if (name = (new RegExp('[?&]' + encodeURIComponent(name) + '=([^&]*)')).exec(window.location.search))
return decodeURIComponent(name[1]);
}
})();
</script>
You really should not change URLs with regexp and string manipulation.
Here is the recommended way
const url = new URL(location.href); // change to tempLink
utms = [
"utm_medium=med",
"utm_source=src",
"utm_campaign=camp"
];
utms.forEach(utm => url.searchParams.set(...utm.split("=")))
console.log(url.toString())
I'm having trouble, grabbing the parameters from a link and appending them to the end of the link. I can change the text of an element but not the attribute. See my not working example.
$(document).ready(function() {
var urlParams = window.location.search;
if (urlParams) {
// remove leading '?' if present
var cleanUrlParams = (urlParams[0]=='?') ? urlParams.substring(1, urlParams.length) : urlParams;
// remove leading and trailing '&' if present
var cleanUrlParams = (cleanUrlParams[0]=='&') ? cleanUrlParams.substring(1, cleanUrlParams.length) : cleanUrlParams;
var cleanUrlParams = (cleanUrlParams[cleanUrlParams.length - 1]=='&') ? cleanUrlParams.substring(0, cleanUrlParams.length - 1) : cleanUrlParams;
// include only the url params with values
var includeUrlParams = "";
var urlParamPairs = cleanUrlParams.split("&");
for (var i = 0; i < urlParamPairs.length; i++) {
var splitUrlParamPair = urlParamPairs[i].split("=");
if ((splitUrlParamPair.length == 2) && (splitUrlParamPair[1].length > 0)) {
if (includeUrlParams.length > 0) {
includeUrlParams = includeUrlParams + "&";
}
includeUrlParams = includeUrlParams + urlParamPairs[i];
}
}
// if there are url parameters then append them to something in the DOM
if (includeUrlParams.length > 0) {
$(".editMyUrlParams").attr("href" + includeUrlParams);
}
}
});
And then calling it like this
<a class="editMyUrlParams" href="http://thisisawebsite.com/">This is a link</a>
This is where I go wrong I think. If I change the following to text - it works
if (includeUrlParams.length > 0) {
$(".editMyUrlParams").text("There are the params: " + includeUrlParams);
}
So I know I'm missing something where I can append the attributes to the end of the href and get a result like this
<a class="editMyUrlParams" href="http://thisisawebsite.com/?param1=this1¶m2=this2">This is a link</a>
Thanks in advance for any help
Use the jQuery .attr() method:
$(".editMyUrlParams").attr('href', $(".editMyUrlParams").attr('href') + stringToAppend);
Or better:
var $elements = $(".editMyUrlParams");
var oldHrefValue = $elements.attr('href');
var newHrefValue = oldHrefValue + stringToAppend;
$elements.attr('href', newHrefValue);
I have a pager with this url: news?page=1&f[0]=domain_access%3A3".
I need a regex to replace the page=1 with page=2
The 1 and 2 are variable, so I need to find page= + the first character after that.
How can I do that
#EDIT:
from the answers, I distilled
var url = $('ul.pager .pager-next a').attr("href");
var re = /page=(\d+)/i;
var page = url.match(re);
var splitPage = page[0].split("=");
var pageNumber = parseInt(splitPage[1]);
pageNumber += 1;
var nextPagePart = 'page=' + pageNumber;
var nextPageUrl = url.replace(re, nextPagePart);
$('ul.pager .pager-next a').attr("href", nextPageUrl);
There might be a shorter approach ?
Like this:
var url = 'news?page=1&f[0]=domain_access%3A3"';
var page = 2;
url = url.replace(/page=\d+/, 'page=' + page);
EDIT
To achieve what did in your edit:
var obj = $('ul.pager .pager-next a');
var url = obj.attr('href');
url = url.replace(/page=\d+/, 'page=' + (++url.match(/page=(\d+)/)[1]));
obj.attr('href', url);
If you want to replace only a page number and leave the rest You can try something like this:
s/\(.*\)page=\d{1,}\(.*\)/\1number_to_replace\2/
Hi all i have an url where i need to get an parameter from the url
var URL="http://localhost:17775/Students/199/Kishore"
//here from the url i need to get the value 199
this is what i had been trying but the value is null here
function getURLParameter(name) {
return parent.decodeURI((parent.RegExp(name + /([^\/]+)(?=\.\w+$)/).exec(parent.location.href) || [, null])[1]);
};
$(document).ready(function() {
getURLParameter("Students");
//i need to get the value 199 from the url
});
jQuery is not needed for this, though it could be used. There are lots of ways to skin this cat. Something like this should get you started in the right direction:
var URL="http://localhost:17775/Students/199/Kishore";
var splitURL = URL.split("/");
var studentValue = "";
for(var i = 0; i < splitURL.length; i++) {
if(splitURL[i] == "Students") {
studentValue = splitURL[i + 1];
break;
}
}
Here's a working fiddle.
Edit
Based on the comments, indicating that the position will always be the same, the extraction is as simple as:
var url = "http://localhost:17775/Students/199/Kishore";
var studentValue = url.split("/")[4];
This is what you're looking for since the URL parameter will keep changing:
http://jsbin.com/iliyut/2/
var URL="http://localhost:17775/Students/199/Kishore"
var number = getNumber('Students'); //199
var URL="http://localhost:17775/Teachers/234/Kumar"
var number = getNumber('Teachers'); //234
function getNumber(section) {
var re = new RegExp(section + "\/(.*)\/","gi");
var match = re.exec(URL);
return match[1];
}
I would do the following:
var url = "http://localhost:17775/Students/199/Kishore";
var studentValue = url.match('/Students/(\\d+)/')[1]; //199
So, I was messing around with this Dynamic Breadcrumbs write-up, and came across an issue where if the directory name has a space in it, then %20 gets added to the actual visible breadcrumb. Would this be removed using the decodeURI() function or is there a better way?
Here's the js:
var crumbsep = " • ";
var precrumb = "<span class=\"crumb\">";
var postcrumb = "</span>";
var sectionsep = "/";
var rootpath = "/"; // Use "/" for root of domain.
var rootname = "Home";
var ucfirst = 1; // if set to 1, makes "directory" default to "Directory"
var objurl = new Object;
// Grab the page's url and break it up into directory pieces
var pageurl = (new String(document.location));
var protocol = pageurl.substring(0, pageurl.indexOf("//") + 2);
pageurl = pageurl.replace(protocol, ""); // remove protocol from pageurl
var rooturl = pageurl.substring(0, pageurl.indexOf(rootpath) + rootpath.length); // find rooturl
if (rooturl.charAt(rooturl.length - 1) == "/") //remove trailing slash
{
rooturl = rooturl.substring(0, rooturl.length - 1);
}
pageurl = pageurl.replace(rooturl, ""); // remove rooturl from pageurl
if (pageurl.charAt(0) == '/') // remove beginning slash
{
pageurl = pageurl.substring(1, pageurl.length);
}
var page_ar = pageurl.split(sectionsep);
var currenturl = protocol + rooturl;
var allbread = precrumb + "" + rootname + "" + postcrumb; // start with root
for (i=0; i < page_ar.length-1; i++)
{
var displayname = "";
currenturl += "/" + page_ar[i];
if (objurl[page_ar[i]])
{
displayname = objurl[page_ar[i]];
}
else
{
if (ucfirst == 1)
{
displayname = page_ar[i].charAt(0).toUpperCase() + page_ar[i].substring(1);
}
else
{
displayname = page_ar[i];
}
}
if ( i < page_ar.length -2 )
{
allbread += precrumb + crumbsep + "" + displayname + "" + postcrumb;
}
else
{
allbread += crumbsep + displayname;
}
}
document.write(allbread);
If decodeURI() was to be used, where exactly would it go? Also, more unrelated, would there be an option you could add to the code above that would make the actual page inside of the directory be included in the breadcrumbs as the last item instead of the last directory? Not real important but thought I would ask as well. Thanks for any input!
Yes, decodeURI will do the trick. You can add the line displayname = decodeURI(displayname); right before the if that reads if ( i < page_ar.length -2 ):
...
displayname = decodeURI(displayname);
if ( i < page_ar.length -2 )
...
Note that since displayname and currenturl end up being directly embedded in a raw HTML string, any special HTML characters should be escaped first, otherwise you're open to some XSS attacks (imagine some malicious individual posting a link to your site like yoursite.com/valid/page/%3Cscript%3Ealert%28%22Oh%20no%2C%20not%20XSS%21%22%29%3C%2Fscript%3E). One of the simplest ways to do so is covered by this answer, though it requires jQuery.
If you want the current page included in the breadcrumbs, I believe it is sufficient to change the loop to go from 0 to page_ar.length instead of page_ar.length - 1:
...
for (i=0; i < page_ar.length; i++)
...
You should use decodeURIComponent(), not decodeURI() for this. It's a little hard to see what you're trying to do, but here's some simpler code that will give you an array of the 'directories' in the current URI, decoded:
var dirs = location.pathname.split('/');
for (var i=0,len=dirs.length;i<len;++i){
dirs[i] = decodeURIComponent(dirs[i]);
}