网址中存在特定字符串时隐藏元素

Question

I want to hide a button when the string "wholesale' is present in the url. I've tried a few variations of the following code but it just won't work.

<script type="text/javascript">
$(document).ready(function () {
    if (/wholesale/.test(window.location.href)) {
       document.getElementsByClassName('variations_button')[0].style.display = 'none';
    }
});
</script>

Answer 1

May be this will help.

 var patt = new RegExp("wholesale");
    if (patt.test(window.location.href)) {
          $('.variations_button').hide();
        }

Answer 2

you are doing wrong with the select element by class name code

it should be like this:

document.getElementsByClassName('variations_button')[0].style.display='none'

Note:

document.getElementsByClassName returns an array of elements with the same class name. So document.getElementsByClassName('variations_button')[0] will return the first element with the class name variations_button .

Answer 3

you have a problem with getElementByClassName , it should be getElementsByClassName and will return a HTMLCollection (Array like object) not an element. You should probably also use jQuery if that is already loaded on the page. jQuery is an array like object of HTMLElements that will give you methods that will run over the entire collection.

edit: here is a working example, click 'Run code snippet' to see the result. I had to change the regex to match what was in the snippet, but you should get the idea.

 console.log( 'is jQuery installed on the page', typeof $ !== void 0 ); $(function () { console.log( 'href', window.location.href ); if (/stacksnippets/.test(window.location.href)) { console.log('regex found in href'); $('.variations_button').css('background', '#3cf'); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://codepen.io/synthet1c/pen/WrQapG.js"></script> <button class="variations_button">variations button</button>