We Keep Coding

Search and replace data-reactid

I am trying to look for data-reactid value and replace it with another value.
Here is the code:
Book a Room.
trying to use the code to replace ".0.2.2" with ".0.2.3"
(function () {
var link = document.querySelectorAll('a[data-reactid*=".0.2.2"]') //change example.com to any domain you want to target
var searchString = ".0.2.2" //the string to be searched forEach
var replacementString = ".0.2.3" //the replacement for the searched string
links.forEach(function(link){
var original = link.getAttribute("data-reactid");
var replace = original.replace(searchString,replacementString)
link.setAttribute("data-reactid",replace)
})
})();

Just change this
var link = document.querySelectorAll('a[data-reactid*=".0.2.2"]')
to this
var links = document.querySelectorAll('a[data-reactid*=".0.2.2"]')
But keep in mind that you should not change the attributes set by React itself

issue when trying to split url in js

Hi guys I am trying to take token from url.
I am trying this code
const userURL = document.location;
const shared_token = userURL.split('/')[4].split('?')[0];
alert(shared_token)
my url is something like this:
http://www.something.com/earlyAccessPage/%217y%2299%24SYE8FJ7s9oVWix1i6HSC9ega21nXhhOty0UbgrX09jQhssmXMPhXK?fbclid=IwAR2cFvZgJAJsm1zaaRVdb20vzGzZg1qnazTtW-9Bm25DIsiSkdIBEKdjNfo
But it's show error: userURL.split is not a function. Please help me to correct my code.

Use location.pathname - that can be document.location or window.location - either will work for you: Location object
location.pathname.split("/").pop()
returns
%217y%2299%24SYE8FJ7s9oVWix1i6HSC9ega21nXhhOty0UbgrX09jQhssmXMPhXK
Using your code:
const userURL = document.location;
const shared_token = userURL.pathname.split('/').pop(); // take the last part of the path
alert(shared_token)
NOTE In the example I use new URL() to make a URL from the URL you provided. You just need document.location
// const shared_token= location.pathname.split("/").pop() in your real code
const shared_token= new URL("http://www.something.com/earlyAccessPage/%217y%2299%24SYE8FJ7s9oVWix1i6HSC9ega21nXhhOty0UbgrX09jQhssmXMPhXK?fbclid=IwAR2cFvZgJAJsm1zaaRVdb20vzGzZg1qnazTtW-9Bm25DIsiSkdIBEKdjNfo")
.pathname
.split("/")
.pop()
console.log(shared_token)
To get parameters AFTER the ? use
// const url = location
const url = new URL("http://www.something.com/earlyAccessPage/%217y%2299%24SYE8FJ7s9oVWix1i6HSC9ega21nXhhOty0UbgrX09jQhssmXMPhXK?fbclid=IwAR2cFvZgJAJsm1zaaRVdb20vzGzZg1qnazTtW-9Bm25DIsiSkdIBEKdjNfo")
const usp = new URLSearchParams(url.search)
const fbclid = usp.get("fbclid")
console.log(fbclid)

this is wrong. document.location returns location object. you are try to split location object. so instead of that try to use const url = document.URL.
ref : Document.URL
const userURL = document.URL;
const shared_token = userURL.split('/')[4].split('?')[0];
alert(shared_token)

You get a Location object back from document.location which already splits up the url for you in handy ways. See the docs for details, but it looks like userURL.search would give you what's after the question mark. So your code could simply to:
// if you want the first value after the '?' you can do this:
const search = document.location.search;
const firstSearch = search ? search.substring(1).split("&")[0] : "";
// if you want the value immediately before the '?' you can do this:
const segments = document.location.pathname.split("/");
const lastSegment = segments[segments.length-1];
You can always use the original userURL.href but see the various parts of Location that are already prepared for you (like host, port, pathname and search).

How to Store and Call Only Certain UTM Parameter Key and Value Pairs

I am trying to get only certain key value pairs of UTM parameters from inbound viewers and then build a new url search string to send additional query string parameters elsewhere on a page button click.
Here is what the inbound URL looks like:
https://testsite1.s3-us-west-1.amazonaws.com/index.html?utm_source=sna&utm_medium=soc&utm_campaign=pro&utm_term=us&utm_content=951431114
I only need to collect the utm_content= parameter's value but I'm not sure how to get this last part properly to store it. Here is what I currently have:
const queryString = window.location.search;
if (queryString !== null) {
//const p = new URLSearchParams(s);
const queryStringParamVal = queryString[5].value; //not working?
I'll then rebuild a new URL with the utm_content's value and append some new query string parameters on a button click URL.
const link = "https://testsite2.s3-us-west-1.amazonaws.com/index.html? " + "merchantID=12345&userID=654321&productID=" + queryStringParamVal

Use a regex to parse it:
var queryString = "utm_source=sna&utm_medium=soc&utm_campaign=pro&utm_term=us&utm_content=951431114";
var utm_content = queryString.match(/utm_content=([^&]+)/)[1];
console.log(utm_content)
You can also parse the whole string into an object:
var queryString = "utm_source=sna&utm_medium=soc&utm_campaign=pro&utm_term=us&utm_content=951431114";
var parameters = Object.fromEntries(queryString.split("&").map(el => el.split("=")));
console.log(parameters)
console.log(parameters.utm_content)

Get a specific string of numbers inside an url

So here we have some url's from same domain:
http://example.com/video6757788/sometext
http://example.com/video24353/someothertext
http://example.com/video243537786/somedifferenttext
http://example.com/video759882
http://example.com/video64353415
http://example.com/video342432?session=somestring
How to get just the numbers part that comes after video in all types of the url's. I'm trying to get the video id's.
First i get the url's, but then how do I get the id's?
var url = $('a[href*="example"]');
var id = ???

Use a regular expression:
$('a[href*="example"]').each(function() {
var $this = $(this);
var url = $this.attr("href");
var id = url.match(/video(\d+)/i)[1]; //retrieve the number following video*
//logic
})
Or if you want to be fancy with .attr(), equivalent would be:
$('a[href*="example"]').attr("href", function(indx, url) {
var id = url.match(/video(\d+)/i)[1]; //retrieve the number following video*
//logic
})

I want to find replace one url query parameter with jquery

I want to replace a dynamic url query parameter with another parameter.
Eg. like my url is:
http://www.mysite.com/209-0539.prd?pageLevel=&skuId=111-4567&sc_cmp=pcp_GSF_Batteries+%26+Electrical+Accessories_209-0539
I want to replace everything starting after
&sc_cmp=pcp_GSF_Batteries+%26+Electrical+Accessories_209-0539
and add something like & new Static string
My final url should look like:
http://www.mysite.com/209-0539.prd?pageLevel=&skuId=111-4567& new static string.
Thanks

I recommend you to use the cool URI.js library, then it's as easy as:
var url = "http://www.mysite.com/209-0539.prd?pageLevel=&skuId=111-4567&sc_cmp=pcp_GSF_Batteries+%26+Electrical+Accessories_209-0539";
url = URI(url).removeSearch("sc_cmp").addSearch("newvar","newval");
// http://www.mysite.com/209-0539.prd?pageLevel=&skuId=111-4567&newvar=newval
alert(url);
See working demo .

If you don't want to include another library, following lets you add as many search items you want removed and add as many as you like without a lot of code
/* array of search keys to remove*/
var removeSearch = ['sc_cmp'];
/* array of new search items*/
var newSearchitem = ['image=cool'];
var url = location.href;
var pageUrl = url.split('?')[0];
var urlSearch = url.split('?')[1].split('&');
/* store search items in array */
var newSearchArr = [];
/* loop over exisiting search items and store keepers*/
for (i = 0; i < urlSearch.length; i++) {
var key = urlSearch[i].split('=')[0];
if ($.inArray(key, removeSearch) == -1) {
newSearchArr.push(urlSearch[i])
}
}
$.merge(newSearchArr, newSearchitem);
var newUrl = pageUrl + '?' + newSearchArr.join('&')
DEMO: http://jsfiddle.net/9VPUX/