Click here to Skip to main content
15,886,873 members
Home / Discussions / JavaScript
   

JavaScript

 
GeneralRe: auto submit form Pin
joe-hanh25-Feb-15 2:31
joe-hanh25-Feb-15 2:31 
QuestionGet selected Li from UL Pin
indian14323-Feb-15 15:02
indian14323-Feb-15 15:02 
AnswerRe: Get selected Li from UL Pin
Matt U.24-Mar-15 9:59
Matt U.24-Mar-15 9:59 
AnswerRe: Get selected Li from UL Pin
Simewu15-Jun-15 15:23
professionalSimewu15-Jun-15 15:23 
QuestionHiding a button which doesn't have an ID or Name Pin
indian14322-Feb-15 8:52
indian14322-Feb-15 8:52 
SuggestionRe: Hiding a button which doesn't have an ID or Name Pin
Kornfeld Eliyahu Peter23-Feb-15 6:07
professionalKornfeld Eliyahu Peter23-Feb-15 6:07 
GeneralRe: Hiding a button which doesn't have an ID or Name Pin
indian14323-Feb-15 12:05
indian14323-Feb-15 12:05 
AnswerRe: Hiding a button which doesn't have an ID or Name Pin
enhzflep27-Feb-15 5:48
enhzflep27-Feb-15 5:48 
Sure you can. You can get to any element in the html so long as you know it's position in relation to other elements.
I like to think of this approach as somewhat akin to climbing a tree with your eyes closed. So long as you've looked at the tree first and know where the branches are in relation to one another, you can climb away. It's fraught with danger though, because you can remember the relationships wrong or they can change from when you look at them to when you try to use them.

It may well be a poor analogy - but it works for me.

--

You can take advantage of a function querySelectorAll for this task. It allows you to pass in a string which would serve as a css selector for the element.
In your case, you want to target a button element that's contained in an element with the footer class. The css selector for this would be .footer button

See below for a short demo that allows you to hide/show the target button.

HTML
<!DOCTYPE html>
<html>
<head>
<script>
"use strict";
function byId(e){return document.getElementById(e);}

window.addEventListener('load', onDocLoaded, false);

function onDocLoaded()
{
    byId('mHideShowBtn').addEventListener('click',onHideShowBtnClick,false);
}

function onHideShowBtnClick(e)
{
    var tgtBtn = document.querySelectorAll('.footer button')[0];

    // works because the button doesn't have its display style attribute set in the html
    // if the button had a css rule that set its display attribute to none, this code would fail
    // since it doesn't test for applicable css rules - only style directly applied to the element
    if (tgtBtn.style.display == '')
        tgtBtn.style.display = 'none';
    else
        tgtBtn.style.display = '';
}

</script>
<style>
/* un-comment the below style to see the effect of the comment in onHideShowBtnClick */
/*
.footer button
{
    display: none;
}
*/
</style>
</head>
<body>
    <div class="footer" style="position: absolute; bottom: 0px; width: 95%; margin-left: 2%; z-index: 3;">
        <button style="width: 80px; background: url(http://localhost/ELMS/Image.axd?t=Close&r=211&g=211&b=211&p=20&h=25) 0% 0% no-repeat transparent;">Close</button>
    </div>
    <hr>
    <button id='mHideShowBtn'>Hide/Show</button>
</body>
</html>

"When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down 'happy'. They told me I didn't understand the assignment, and I told them they didn't understand life." - John Lennon

QuestionNew to JQuery Pin
indian14319-Feb-15 9:08
indian14319-Feb-15 9:08 
AnswerRe: New to JQuery PinPopular
Richard MacCutchan19-Feb-15 21:30
mveRichard MacCutchan19-Feb-15 21:30 
GeneralRe: New to JQuery Pin
indian14320-Feb-15 11:35
indian14320-Feb-15 11:35 
GeneralRe: New to JQuery Pin
Richard MacCutchan20-Feb-15 21:47
mveRichard MacCutchan20-Feb-15 21:47 
GeneralRe: New to JQuery Pin
Amarnath S23-Feb-15 5:29
professionalAmarnath S23-Feb-15 5:29 
QuestionGetting text from UL using jquery Pin
indian14319-Feb-15 8:55
indian14319-Feb-15 8:55 
AnswerRe: Getting text from UL using jquery Pin
Dennis E White20-Feb-15 4:56
professionalDennis E White20-Feb-15 4:56 
QuestionI want to move slider/carousel automatically without clicking first to start Pin
Member 1048773918-Feb-15 9:31
Member 1048773918-Feb-15 9:31 
AnswerRe: I want to move slider/carousel automatically without clicking first to start Pin
ZurdoDev19-Feb-15 4:18
professionalZurdoDev19-Feb-15 4:18 
AnswerRe: I want to move slider/carousel automatically without clicking first to start Pin
Santosh K. Tripathi31-Mar-15 1:59
professionalSantosh K. Tripathi31-Mar-15 1:59 
QuestionHelp with arrays assignmet Pin
WebDesignStudent17-Feb-15 6:51
WebDesignStudent17-Feb-15 6:51 
GeneralRe: Help with arrays Pin
PIEBALDconsult17-Feb-15 6:59
mvePIEBALDconsult17-Feb-15 6:59 
GeneralRe: Help with arrays Pin
PIEBALDconsult17-Feb-15 7:13
mvePIEBALDconsult17-Feb-15 7:13 
QuestionGetting started with Javascript Pin
Atinesh16-Feb-15 6:37
Atinesh16-Feb-15 6:37 
AnswerRe: Getting started with Javascript Pin
Richard MacCutchan16-Feb-15 7:44
mveRichard MacCutchan16-Feb-15 7:44 
AnswerRe: Getting started with Javascript Pin
Amarnath S23-Feb-15 5:27
professionalAmarnath S23-Feb-15 5:27 
AnswerRe: Getting started with Javascript Pin
Anshul Shukla23-Feb-15 5:29
Anshul Shukla23-Feb-15 5:29 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.