Showing div's by URL [closed] - javascript

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I know this is probably a stupid question but unfortunately our programmer at work is sick today, of course my deadline is today... I seriously have no clue.
I have 2 divs: .translate_EN and .translate_NL
Well the problem is I need to show .translate_EN when my URL contains /en/ and show .translate_NL when my URL contains /nl/. It can also be selected by: www.domain.com/en/ and www.domain.com/nl/
You will help me ALOT if you can provide me this script!
Many thanks in advance!

This code will return '/en/' if url contains '/en/' or null if it doesn't.
window.location.href.match('/en/')
So you can write if block and make your div's property display block or none.
E.g.:
Make your divs style: display: none then on the page write that code inside <script> tag:
var isEn = window.location.href.match('/en/');
var makeVisible = function(className) {
document.getElementsByClassName(className).item().style.display = 'block';
}
if (isEn)
makeVisible('translate_EN');
else
makeVisible('translate_NL');
I don't know all your requirements but that code will help you to understand what you need to do.
If you have a jQuery on your page, then it can be done with that code:
$('.translate_' + window.location.href.match(/\/[a-z]{2}\//g).pop().replace(/\//g, '').toUpperCase()).show()

Related

How do I target $0 without getElementById [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 4 years ago.
Improve this question
I am trying to find the appropriate way to edit an element but it seems like their is only one node with an ID. I have thought of
my code looks like:
var root=document.getElementById("app-mount").childNodes;;
var child = root[n].innerHTML;
But this is not reusable to get the path to any element such as $0 used in chrome dev tools. I was wondering if there was a method one could call on $0 to just give me the path so one could know how to target it as one does for an ID document.getElementById('id');
Edit:
after getting help I have updated my code to look like:
document.querySelectorAll('svg')[1].outerHTML="<img id='orb' class='orb' src='https://i.imgur.com/k3d8qMN.gif' width='50' height='60'>"
Its for a theme I am making for discord!
Thanks for the help!
I am not sure that I am following your question very well, but if I understand you correctly, you are looking for something like querySelector or querySelectorAll.
You can use CSS commands to target various HTML elements. eg:
document.querySelector('div'); //returns the first div
document.body.querySelectorAll('div'); //returns all the divs attached to the body element
You can also target ids:
document.querySelector('#app-mount');
or classes:
document.querySelector('.blue');
and query selectors may also be used:
document.querySelector('#app-mount > ul > li:nth-child(3)');

why doesn't this javascript code work document.getElementsByClassName("para")[0].innerHTML.style.visibility = "hidden"; [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
I have this code that will make the relevant paragraph disappear:
var first = paragraph[0].innerHTML = " "
but can't figure out why the following line of code won't make the paragraph disappear:
document.getElementsByClassName("para")[0].innerHTML.style.visibility = "hidden";
you don't need innerHTML, use
document.getElementsByClassName('para')[0].style.visibility = 'hidden';
document.getElementsByClassName("para")[0].innerHTML returns a string, you need the first element with class para, remove .innerHTML and it will work.
document.getElementsByClassName("para")[0].style.visibility = "hidden";

Javascript delay/resizing [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
Hi i want to shrink and image and then resize it while keeping it in the same place(centerd in the page) i would like to do this using javascript. I want this to happen on a onclick event. If you need to see my code its here http://cannonmc.net/ .
For more of an idea of what i want/need look at http://orteil.dashnet.org/cookieclicker/ i want to do the same to my image as what happens when you hover/click on that cookie :).
Thanks
Luke.
I made a very simple example for you, I hope this helps.
var image = document.getElementById('image');
image.onmousedown = function() {
image.style.width = "47%";
};
image.onmouseup = function() {
image.style.width = "";
}
Would be all JavaScript needed, with the additional CSS.
Working example here:
http://jsfiddle.net/zy96xqc7/2/

How to remove spaces between words in a link? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
Shortened up:
I need
View in iTunes
to appear as
View in iTunes
Detailed:
So basically what I'm doing is I'm trying to link to the itunes store I'll use this link as an example itunes.com/OfMonstersandMen/MyHeadIsAnAnimal.
This links directly to the item on the iTunes store. I'm using blogger and I'm going to automatically fill the links. The only problem with that is the links will appear as itunes.com/Of Monsters and Men/My Head Is An Animal. So what I need to do is use javascript or jquery to remove the spaces between the words in the link.
I've been looking all over for a solution. Is there anything I can do to fix this??
jsBin demo
$('.view-itunes a[href*=" "]').prop('href', function(i, v){
return v.replace(/%20/g,"");
});
Cause the browsers translates blanks inside href with %20
View in iTunes
<a id="result">View in iTunes</a>
<!--this is a example to result:-->
<b></b><br>
jquery
var aq = $('a').attr('href').split('%20').join('');
$('#result').attr('href',aq);
//this is a example to result:
$('b').text(aq);
Just use string replace function
var a="test%20string";
var b=a.replace(/%20/g, "");

Saving information in HTML Tags / jQuery [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I want so save states of containers in any tags of them to use it with jQuery. The problem is JS says undefined if I use data-xy and data() or attr().
What is the best way to achieve this?
Had this a lot of times. the data attribute will be lowercase, always.
Say:
<div id="hello" data-testHello="HelloThere">Test</div>
The data will still be accessed by:
$('#hello').data("testhello"); rather than "testHello".
Hope this helps.
Create an object with property as the id of div or element, and the value.
<div id="foo"><span>this is a test</span></div>
For set the state
var stateStore = {};
stateStore["foo"] = "dirty";
For access to the state
$("div").each(function(){
MakeAnythingWithIt(this);
})
function MakeAnythingWithIt(theElement)
{
var elementState = stateSore[$(theElement).attr("id")];
}
Another way is append an input type="hidden" with the state information

Categories