This may be answering my own question, but I'm not sure. I'm using Bootstrap navs to have tabs on a page, with two primary tabs and several more tabs nested within one of those tabs. I want them to be directly linked with a hashtag and for the back button to navigate between them. Direct linking was easy to accomplish, but the back navigation didn't properly work: clicking the back button to go back from the primary tab without nested tabs to a nested tab (from 'Tab One One' to any 'Tab Two [One, Two, Three]' in the code I've shared) would change the hash but not open the desired tab.

I posted about this here, didn't get a reply, and couldn't find other code that would do this, until I found jquery-stickytabs, specifically the fork for nested tabs. It functions just as I would like, but, as coded, the resulting URLs are quite bulky, including the 'data-section' used to direct the 'data-target' (ie "#[data-section='section5']&[data-section='section5.3']"). That library is pretty old, so my query about whether this could be altered went understandably unanswered.

Thus, though I have nothing but the most passing understanding of javascript or jquery, did I fiddle around with it, and I appear to have got it to work as I wanted with simpler URLs. But, for my lack of experience I worry that maybe I've done something that I shouldn't have etc. Or, if not, for anyone else perhaps looking for this functionality I figured that I would share.

I have put the basic code in this codepen. It's coded as I've got it to work live, but the jfiddle doesn't run; perhaps due to the interaction of the href in the code? Or something I've done wrong but don't understand! Hence this question as well. And so I've also included what I changed below.

Thank you!

The only real alterations I made from the original were here, from this:

var showTabFromHash = function (hash) {
            var selector = hash ? 'a[' + settings.selectorAttribute + settings.selectorOperator + '"' + hash.split(settings.fragmentPathSeparator)[0] + '"]' : settings.initialTab;
            $(selector, context).tab('show');
            if (settings.backToTop === true) {
                setTimeout(backToTop, 1);
            }
            else if (hash) {
                var indexOfFirstFragmentPathSeparator = hash.indexOf(settings.fragmentPathSeparator);
                if (indexOfFirstFragmentPathSeparator > 0) {
                    var remainingHash = hash.substring(indexOfFirstFragmentPathSeparator + 1);
                    var element = document.getElementById(remainingHash);
                    if (element) {
                        scrollToElement($(element));
                    }
                    else {
                        showTabFromHash(remainingHash);
                    }
                }
            }
        };

to this:

var showTabFromHash = function (hash) {
            var selector = hash ? 'a[href="#' + hash.split(settings.fragmentPathSeparator)[0] + '"]' : settings.initialTab;
            $(selector, context).tab('show');
            if (settings.backToTop === true) {
                setTimeout(backToTop, 1);
            }
            else if (hash) {
                var indexOfFirstFragmentPathSeparator = hash.indexOf(settings.fragmentPathSeparator);
                if (indexOfFirstFragmentPathSeparator > 0) {
                    var remainingHash = hash.substring(indexOfFirstFragmentPathSeparator + 1);
                    var element = document.getElementById(remainingHash);
                    if (element) {
                        scrollToElement($(element));
                    }
                    else {
                        var selector2 = remainingHash ? 'a[href="#' + hash + '"]' : settings.initialTab;
                        $(selector2, context).tab('show');
                    }
                }
            }
        };

which allowed the nested tab href to go from this:

#[data-section='tabonetwo']&[data-section='tabtwothree']

to this:

#tabonetwo&tabtwothree