Develop Reference

How to append current path ending to href in body link

I am new to this site, and I know almost nothing about programming, so this question may have a simple answer.
I want to have links in my site that are able to grab a part of the current URL address to complete the href and send me to the desired webpage.
For example, let’s say that the webpage in my site I am viewing is:
https://www.example.com/notes/note-1
And then I have links in the same page like these ones:
https://www.example.com/editor1
https://www.example.com/editor2
Is there a way (java or jquery) that I can grab the last part of the path name (/note-1) to dynamically add it to my html links so the new addresses become?:
https://www.example.com/editor1/note-1
https://www.example.com/editor2/note-1
Now, I don’t need a code that appends “note-1” to the href, but that appends the ending of the current path—whatever it maybe (“/note-2, /note-3, etc.) to the href.
Thanks for your help.

You could implement it like so:
const idx = location.href.lastIndexOf('/');
const lastPart = idx !== -1 ? location.href.slice(idx + 1): "";
document.querySelectorAll('a').forEach(a=>a.href+=lastPart);

Get dynamically created names of dynamical links

I need to create a link for a set of documents. They are created dynamically, thus the names are also different, f.ex. Test, Test2, so one.
I need to show the link like "Document TestN", where links changed according to the current document. I can now create the links by a href="id" onklick=bla+bla+bla", but the name does not change. Instead of 'Dashboard' I need to get 'Dashboard of "ConcreteSite"', where I can get names by pageHeader:
document.getElementById("pageHeading").appendChild(pageHeading);
<script language="javascript" type="text/javascript">
var siteNameAsParam = window.location.search;
var scrt_var = siteNameAsParam.split("siteName=")[1];
</script>
<p>You are here: Dashboard </p>

Based on your code I think this is what you're after but more detail on what you're trying to do would be great.
<p>You are here: Dashboard </p>
<p>You are here: Dashboard </p>
<script>
document.addEventListener('DOMContentLoaded', function(event) {
var links = document.getElementsByTagName("a");
for (i = 0; i < links.length; i++) {
var siteNameAsParam = window.location.search;
var scrt_var = siteNameAsParam.split("siteName=")[1];
links[i].href = links[i].href + '?siteName=' + scrt_var;
links[i].innerText += ' fred';
}
}, false);
</script>
This does the following:
On page load gets all links on the page
loops through the links and grabs the query strings from the url
splits the query string on siteName
sets each link url to add the query string
updates the links text to append the query string (or undefined if it doesn't exist (see note below)
Note: your code implies you already have a query string in the url of siteName=SITENAMEHERE. Also, depending what you're trying to achieve, there are probably much better approaches. This I hope answers your current question but I think you should review how other achieve what you're after.
Update:
Here is a jsfiddle with a different working sample of what I think you might want. Hopefully it helps. there are comments in the fiddle. I think you want to try doing more when the link is created (set the event listener there, update the text as desired, etc.) instead of on the click event.

Tampermonkey - add page using non-existing URL

I'm creating a userscript which adds new functions to a website.
The website has many users, but doesn't have a feature to search for users.I want to create such a function. To do that, I have created a button in the already existing search page for other search purposes. When I click the button, I need the script to search for the input on Google and fetch the URLs and show the results in a piece of HTML code on a non-existing page.
Can I fake an URL with a userscript, so that it uses it to show HTML?
If not, can I replace certain HTML within the page?
The code isn't really that interesting. It just adds a button with a link and selects it when on the non-existing page.
CODE:
if (document.URL == "http://www.bierdopje.com/search" || document.URL == "http://www.bierdopje.com/search/" || window.location.href.indexOf("search/shows") > -1 || window.location.href.indexOf("search/episodes") > -1 || window.location.href.indexOf("search/forum") > -1) {
var users = document.createElement('li');
users.setAttribute('class', 'strong');
var UsersNode = document.createTextNode("Gebruikers");
var UsersLink = document.createElement('a');
UsersLink.setAttribute('href', 'http://www.bierdopje.com/search/users/');
document.getElementById("submenu").childNodes[1].appendChild(users).appendChild(UsersLink).appendChild(UsersNode);
if (window.location.href.indexOf("search/users/") > -1) {
UsersLink.setAttribute('href', './');
UsersLink.setAttribute('class', 'selected');
}
}

Sorry for answering my own question, but like Brock Adams already said: it may have been too localized.
The solution to fake an url is to replace the 404 not found content.
If there's like a container with a header and a paragraph, find the container by making it a variable, and then replace it with another variable:
// find the container
var example = document.getElementById('container').childNodes[0];
// set new container
var newcontainer = document.createElement('div');
newcontainer.setAttribute('id', 'ncontainer');
// replace the existing container with the new one
example.parentNode.replaceChild(replacement, example);
// write content to the new container
document.getElementById('ncontainer').innerHTML ='<p>This is not a 404 anymore</p>';
There are probably a lot more and shorter ways to accomplish this, but they can be found by Google (javascript replace).
To replace the complete page, use
document.write()
To finish the page, you can set the title with the following:
document.title = "WEBSITE TITLE";

Counting classes on another page and displaying them

To save me a lot of work editing a number in when adding a document to a site I decided to use javascript to count the number of elements with a class doc .
I am two main problems:
There is trouble displaying the variable. I initially thought this was because I hadn't added function, however when I tried adding this the variable was still not displayed.
The elements with the class I want to count are on another page and I have no idea how to link to it. For this I have tried var x = $('URL: /*pageURL*/ .doc').length; which hasn't worked.
Essentially I want the total elements with said class name and this to be displayed in a span element.
Currently I have something similar to what's displayed below:
<script>
var Items = $('.doc').length;
document.getElementById("display").innerHTML=Items;
</script>
<span id="display"></span>
Found an example of something similar here where the total numbers of articles are displayed.
Edit:
#ian
This code will be added to the homepage, domain.net/home.html. I want to link to the page containing this documents, domain.net/documents.html. I've seen this done somewhere before and if I remember correctly they used url:domainname.com/count somewhere in their code. Hope this helps.

Here is a jQuery call to retrieve the url "./" (this page) and parse the resulting data for all elements with class "lsep" "$('.lsep', data)". You should get back a number greater than 5 or so if you run this from within your debug console of your browser.
$.get("./", function(data, textStatus, jqXHR)
{
console.log("Instances of class: " + $('.lsep', data).length)
});
One important thing to remember is that you will run into issues if the URL your are trying to call is not in the same origin.
Here's an updated snippet of code to do what you're describing:
$(document).ready(
function ()
{
//var url = "/document.html" //this is what you'd have for url
//var container = $("#display"); //this is what you'd have for container
//var className = '.data'; //this is what you'd have for className
var url = "./"; //the document you want to parse
var container = $("#question-header"); //the container to update
var className = '.lsep'; //the class to search for
$.get(url, function (data, textStatus, jqXHR) {
$(container).html($(className, data).length);
});
}
);
If you run the above code from your browser's debug console it will replace the question header text of "Counting classes on another page and displaying them" with the count of instances the class name ".lsep" is used.

First, you have to wait until the document is ready before manipulating DOM elements, unless your code is placed after the definition of the elements you manipulate, wich is not the case in your example. You can pass a function to the $ and it will run it only when the document is ready.
$(function () {
//html() allows to set the innerHTML property of an element
$('#display').html($('.doc').length);
});
Now, if your elements belongs to another document, that obviously won't work. However, if you have used window.open to open another window wich holds the document that contains the .doc elements, you could put the above script in that page, and rely on window.opener to reference the span in the parent's window.
$('#display', opener.document.body).html($('.doc').length);
Another alternative would be to use ajax to access the content of the other page. Here, data will contain the HTML of the your_other_page.html document, wich you can then manipulate like a DOM structure using jQuery.
$.get('your_other_page.html', function(data) {
$('#display').html($('.doc', data).length);
});

JavaScript - writing html elements that don't show up?

I'm trying to write some code in javascript that uses a user's cookies to display a box containing some information. The page opens with some boxes containing news articles from Google News RSS feeds. I'm using a 3rd party app for the RSS; the feed is included in the HTML code as such:
<script language="JavaScript" src="http://www.feedroll.com/rssviewer/feed2js.php?src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed" charset="UTF-8" type="text/javascript"></script>
The user can move the boxes around, and I want to store the box locations using cookies so that if a user revisits the page, the boxes will be in the same location. However, when I try to load the page from the information in the cookies, the boxes are blank. This is an example of what my code looks like (RSS feed for news using keyword "Barack Obama"):
// Render boxes into HTML
function renderItem(container) {
var wrapper = document.getElementById(container);
var div_box = document.createElement('div');
var feed_url = 'http://www.feedroll.com/rssviewer/feed2js.php src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed';
var div_box_feed = document.createElement('div');
var feed_script = document.createElement('script');
feed_script.setAttribute('language', 'JavaScript');
feed_script.setAttribute('src', feed_url);
feed_script.setAttribute('charset', 'UTF-8');
feed_script.setAttribute('type', 'text/javascript');
div_box_feed.appendChild(feed_script);
div_box.appendChild(div_box_feed);
wrapper.appendChild(div_box);
}
When the page loads, the box appears but the news articles from the RSS feed are not there and the box is empty. When I look at the source code, however, it is identical to the code of the initial boxes (which did display the news articles).
Does anybody know what's wrong?
Thanks!

You never declared column_div here:
wrapper.appendChild(column_div);
Did you mean:
wrapper.appendChild(div_box);
?

I believe that by default script elements created in this manner have their async attribute set to true, so the rest of your code will execute before your JS has been retrieved.
Where does the column_div variable come from?

You're missing a question mark to separate the post variables from the URL, so the URL is resolving to
var feed_url = 'http://www.feedroll.com/rssviewer/feed2js.php%20src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed';
It should be
var feed_url = 'http://www.feedroll.com/rssviewer/feed2js.php?src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed'