Загружаемый JavaScript для получения страницы; затем установите два идентификатора CSS для отображения: none 'и' display: inline ', переключая две <опции ссылки href

Question

Пожалуйста, я знаком с волшебством JavaScript.Я был бы признателен за помощь при запуске при загрузке страницы, возвращая значение или строку для того, какой конечный локальный путь он получил, чтобы проинструктировать остальную часть сценария либо к / или результату (к жестко закодированному сравнению);и, учитывая результаты, переключите два идентификатора CSS, которые, соответственно, будут иметь один идентификатор, содержащий «display: none», а другой «display: inline», чтобы управлять тем, как нижняя часть страницы связана с выбором навигации, определяемымкакая из двух разных страниц меню является его фактическим исходным родителем.Идентификаторы css, о которых идет речь, будут первоначально установлены локально в разделе «стиль» новой дочерней страницы контента, например:

#MyDisplayOnOff-0 {display:inline;}
and
#MyDisplayOnOff-1 {display:none;}

Страница отправки href будет одним из двух меню, например, упрощенное: "./MenuONE.html "или" ./MenuONE.html#Top "или" ./MenuONE.html#Bottom "OR" ./SECONDMenu.html "или" ./SECONDMenu.html#Top "или" ./SECONDMenu.html.#Bottom "

[фактический пример для ./MenuONE.html]:

http://gladheart.royalwebhosting.net/Menu%20-%20Of%20Lila%20and%20the%20Void.html

http://gladheart.royalwebhosting.net/Menu%20-%20Of%20Lila%20and%20the%20Void.html#Bottom

http://gladheart.royalwebhosting.net/Menu%20-%20Of%20Lila%20and%20the%20Void.html#Top

До сих пор, когда идентичное содержимое было выбрано из одного из двух разных меню, я создавал две html-страницы (с немного измененным названием), содержащие одинаковое содержимое, но с разными навигационными ссылками внизу.Я бы предпочел использовать одну html-страницу, жестко запрограммированную с двумя альтернативными ссылками, а затем с результатом первоначального возврата javascript «страницы отправки», соответственно заполнить два идентификатора (ов) CSS одним «display: none» идругой как «display: inline» для отображения только одного из двух

Вот два реальных примера одного и того же контента на отдельных html-страницах с несколько разными именами, каждая из которых имеет разную структуру нижней ссылки, необходимую в дизайне.каждый раз вызывается из отдельного меню.

http://gladheart.royalwebhosting.net/Poetry%20-%20Time%20and%20i.html http://gladheart.royalwebhosting.net/Poetry%20-%20Time%20and%20i-L.html

Мне кажется, что в javascript может потребоваться следующее:

<[pseudo-] script>

query to determine [get.previous] 'sending-page'


take the string query as returned above [which would be
either eg. 
http://gladheart.royalwebhosting.net/MenuONE.html]
or
http://gladheart.royalwebhosting.net/MenuONE.html]
and parse from right to left over to the  first '/' 
[forward slash] and then discard that forward slash
and all else to the left of it; OR, as an option, just
check the whole string for any one of the six targeted
strings contained in the 'if' conditional statements below.
[[Actually here, a simplified two word word search for either
"MenuONE" or "SECONDMenu" being contained in the string being
evaluated would return the needed result to proceed.]]


if 'sending-page' equal
    "MenuONE.html"
    or
    "MenuONE.html#Top"
    or
    "MenuONE.html#Bottom"
do nothing


if 'sending-page' equal
    "SecondMenu.html"
    or
    "SecondMenu.html#Top"
    or
    "SecondMenu.html#Bottom"
do change
    #MyDisplayOnOff-0 {display:inline;} instead to #MyDisplayOnOff-0 {display:none;}
    and
    #MyDisplayOnOff-1 {display:none;} instead to #MyDisplayOnOff-1 {display:inline; 

Меня попросили добавить используемый html.В теле html-контента (стихов) внизу есть ссылки, например:

<div id="BottomRightpNAV">
    <a href="./Menu%20-%20Rivers%20of%20Mind%20and%20Heart.html">Rivers of Mind and Heart</a>
</div>  

Я хочу добавить вторую ссылку;и с добавленным идентификатором (ами) для переключения, какой из них отображать.Они (id) будут изначально установлены с помощью css в локальной секции 'style' как:

#MyDisplayOnOff-0 {display:inline;}
and
#MyDisplayOnOff-1 {display:none;}

Пример ссылки (один комментарий выше стиля css, показанный в обсуждении сразу выше)будет, в произвольном примере, иметь вторую опциональную ссылку. Будет отображаться только одна за раз.Каждая ссылка с включением идентификатора CSS [эффективно позволяющего включать или выключать одну или другую], будет показана вместе в жестком коде, как показано ниже.

<div id="BottomRightpNAV">
    <a id="MyDisplayOnOff-0" href="./Menu%20-%20Rivers%20of%20Mind%20and%20Heart.html">Rivers of Mind and Heart</a>

    <a id="MyDisplayOnOff-1" href="./Menu%20-%20Of%20Lila%20and%20the%20Void.html">Of Lila and the Void</a>
</div>

Таким образом, в целом, в зависимости отс какой страницы (в данном случае одно из двух меню), с которой пользователь вошел, будет отображаться, если это будет сочтено целесообразным, одна из двух доступных ссылок и будет скрываться ['display: none;'] другая ссылка.

Answer 1

Решение было инициировано благодаря прекрасному совету и примеру кода, предложенному @Andu Andrici. Это было достигнуто путем «выталкивания» информации из родительской страницы меню A или страницы B, чтобы определить, какая страница открыла страницу общего дочернего содержимого. Попытка получить исходную страницу из истории с ее ограничениями безопасности или (за исключением файлов cookie) невозможностью (опять же безопасности) записи в файлы CSS или сценариев сделали это идеальным и элегантным решением. На дочерней странице контента, общей для обеих страниц меню, он был javascript с операторами if, и неизмененный контент, таким образом, имел уникальные и дифференцирующие ссылки, которые произвольно помещались внизу.

zMenuA.html упрощен ниже:

<!doctype html>
<html>
<head>
<title>zMenuA.html [Acknowledgement @Andu Andrici]</title>
</head>
<body>

<a href="./zSameTarget.html?redictedFrom=zMenuA">zMenuA.html invoking zSameTarget.html</a>

</body>
</html>

zMenuB.html ссылки на один и тот же контент практически идентичны и упрощены ниже:

<!doctype html>
<html>
<head>
<title>zMenuB.html [Acknowledgement @Andu Andrici]</title>
</head>
<body>

<a href="./zSameTarget.html?redictedFrom=zMenuB">zMenuB.html invoking zSameTarget.html</a>

</body>
</html>

«zSameTarget.html», страница содержимого с ее навигационной ссылкой «вкл / выкл - или / или», определяемая путем оценки того, какая страница была ее родителем, упрощена ниже:

<!doctype html>
<html>
<head>
<title>zSameTarget.html [Acknowledgement @Andu Andrici]</title>
<style></style>

<script type="text/javascript">
    var MyAppendedUrlMarker = window.location.search

    if (MyAppendedUrlMarker === '?redictedFrom=zMenuA') {
    onload = function () {
    document.head.insertAdjacentHTML('beforeend', "<link href='addOtherCSSstyling.css' type='text/css' rel='stylesheet'/>");

        var MyElement = 
document.getElementById("MyDisplayOnOff0").style.display = "inline";
        var MyElement = 
document.getElementById("MyDisplayOnOff1").style.display = "none";
        }
    }

    if (MyAppendedUrlMarker === '?redictedFrom=zMenuB') { 
    onload = function () {
        var MyElement = 
document.getElementById("MyDisplayOnOff0").style.display = "none";
        var MyElement = 
document.getElementById("MyDisplayOnOff1").style.display = "inline";
        }        
    }
</script>

</head>

<body>

<p style="white-space:pre-wrap;">
This is the child page 'zSameTarget.html' with this content showing 
the same; BUT, at the bottom, with different content [a navigation link] 
being visible and active, solely dictated by which parent page invoked 
this page. To whit, whether in opening this page, an [a href ....] was 
clicked on 'zMenuA.html', or if it came from a click originating from 
'zMenuB.html' instead. NOTE: running this page alone will show two links. 
It is meant to show only one link. Therefore, first open 'zMenuA.html' 
or 'zMenuB.html' and then link to this page from either one of them. As
indicated, depending on the page chosen, one will find it has produced a 
different content [link in this case] visible at the bottom. As well, I 
have added a linked 'myFile.css' to modify the styling elsewhere when
'zMenuA.html' is identified as the parent in the 'if' statements.</p><br/>

    <div>
<a id="MyDisplayOnOff0" href="./Menu%20-%20Rivers%20of%20Mind%20and%20Heart.html">Rivers of Mind and Heart</a> 
<br/>
<a id="MyDisplayOnOff1" href="./Menu%20-%20Of%20Lila%20and%20the%20Void.html">Of Lila and the Void</a> 
    </div>

</body>
</html>

Answer 2

Если я правильно понимаю, вы можете попробовать что-то вроде этого:

Сделать каждую ссылку включающей параметр запроса:

<a href="something.com?redictedFrom=page1">my link's text</a>
<a href="something.com?redictedFrom=page2">my link's text</a>

Параметр запроса - это то, что следует после '? ' в ссылке, и он действует как пользовательский атрибут HTML:

рекомендуется, чтобы это была пара ключ-значение может иметь любое имя - redictedFrom является примером, но может быть любым и любое значение - хотя оно первоначально будет анализироваться как строка, так как сам URL-адрес является строкой.

Затем на странице, на которую он перенаправляется, вы можете сделать что-то вроде:

// get the page's url and check it
var query = window.location.search // will give you the query string, in this example it will be **redictedFrom=page1**
// then you can then search the string to see if contains what you needed
if (query.indexOf("redictedFrom=page1") > -1) { /* do magic */ }

Вы также можете использовать window.location.search.split ('&'), чтобы получить отдельные пары ключ-значение, а также разделить их с помощью string.split ('='). Но это выходит за рамки вопроса.