Как я могу узнать, был ли файл JavaScript уже включен в страницу ASP.NET?

У меня есть пользовательский элемент управления ASP.NET (файл.ascx). В этом пользовательском элементе управления я хочу использовать файл.js.

Итак, я включаю <script src="file.js" type"text/javascript"></script> на странице.

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

Как я могу добавить <script /> объявление, которое будет отображаться на странице, только если страница еще не содержит другой <script /> тег для того же скрипта?

7 ответов

Решение

Поскольку вы используете asp.net, имеет смысл выполнить проверку на стороне сервера, поскольку именно там вы решите добавить ссылку на файл javascript. Из вашего.ascx файла вы можете зарегистрироваться со следующим:

this.Page.ClientScript.RegisterClientScriptInclude("GlobalUnqiueKey", UrlOfJavascriptFile);

... со своей страницы вы просто вызываете объект ClientScript напрямую:

ClientScript.RegisterClientScriptInclude("GlobalUnqiueKey", UrlOfJavascriptFile);

'GlobalUniqueKey' может быть любой строкой (для этого я тоже использую URL файла javascript)

Если вы попытаетесь зарегистрировать скрипт с той же ключевой строкой, он ничего не сделает. Поэтому, если вы называете это на своей странице, в вашем контроле или где-либо еще, у вас останется только одна ссылка на вашей странице. Преимущество этого заключается в том, что вы можете иметь несколько экземпляров элемента управления на странице, и хотя все они пытаются зарегистрировать один и тот же сценарий, это выполняется только один раз. И никому из них не нужно беспокоиться о том, что скрипт уже зарегистрирован.

Существует метод IsClientScriptIncludeRegistered (stringkey), который вы можете использовать, чтобы увидеть, был ли скрипт уже включен под этим ключом, но это выглядит довольно излишним, чтобы сделать эту проверку перед регистрацией, так как множественные попытки регистрации не вызывают исключений или вызывают другие ошибки.

Выполнение проверки на стороне клиента означает, что при условии, что браузер кэширует несколько ссылок javascript (их может и не быть), у вас все еще есть несколько тегов, и каждый из них перегружается, вызывая запуск некоторого javascript. Если у вас есть 20 экземпляров вашего контроля на странице, вы можете получить серьезные проблемы.

Вы можете сделать одну из двух вещей на стороне клиента...

  1. Проверьте dom на наличие тега script, соответствующего файлу javascript, который вы хотите проверить
  2. Протестируйте переменную или функцию, которые, как вы знаете, имеют / будут определены в файле javascript для неопределенных.

Вот быстрая функция JS, которая использует JQuery для того, что вам нужно:

function requireOnce(url) {    
    if (!$("script[src='" + url + "']").length) {
        $('head').append("<script type='text/javascript' src='" + url + "'></script>"); 
    }
}

@ Шимми, через какое-то время я сталкиваюсь с этим, но, возможно, это все еще может быть полезным или, по крайней мере, помочь другим, идущим сзади. Чтобы проверить, загружен ли jquery, сделайте это

<script>window.jQuery || document.write('<script src="js/libs/jquery-1.x.x.min.js"><\/script>')</script>

Не пропустите escape-символ в закрывающем теге script в выражении document.write.

@ Mysomic, почему я не подумал об этом. пальцы вверх

PS: Я бы хотел написать это прямо под строкой, где @Shimmy написал, что сам jQuery - это скрипт, который он хочет загрузить. Но не знаю, как написать это там. не могу увидеть ответ или что-нибудь подобное ссылку. Это может звучать глупо, но, может быть, я что-то упустил. Просьба указать это, кто-нибудь?

Поскольку вы хотите включить JavaScript только на одной странице вашего сайта.
Если вы используете Asp.net(4.0), то это очень просто.
Просто включите следующий код

<script type="text/javascript" scr="filepath and name here"></script>

в ContentPlaceHolder содержания страницы.

Используйте что-то вроде следующего:

if(typeof myObjectOrFunctionDecalredInThisScript != 'undefined') {
  // code goes here
  var myObjectOrFunctionDecalredInThisScript = { };
}

Это проверяет, существует ли уже ваш объект или функция, и таким образом предотвращает повторную декларацию.

var storePath = [];
function include(path){
if(!storePath[path]){
    storePath[path]= true;
    var e = document.createElement("script");
    e.src = path;
    e.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(e);
    return false;
 } }

используйте это на своей главной странице и вызовите функцию include с аргументом javascript имя файла

Если вам это нужно со стороны сервера, и Page.ClientScript.RegisterClientScriptInclude не будет работать для вас, если скрипт был включен каким-либо другим способом, кроме Page.ClientScript.RegisterClientScript (например, page.Header.Controls.Add(..), вы можете использовать что-то вроде этого:

static public void AddJsFileToHeadIfNotExists(Page page, string jsRelativePath)
{
    foreach (Control ctrl in page.Header.Controls)
    {
        if (ctrl is HtmlLink htmlLink)
        {
            if (htmlLink.Href.ToLower().Contains(jsRelativePath.ToLower())) return;
        }
        if (ctrl is ITextControl textControl
          && (textControl is LiteralControl || textControl is Literal))
        {
            if (textControl.Text.ToLower().Contains(jsRelativePath.ToLower())) return;
        }
        if (ctrl is HtmlControl htmlControl)
        {
            if (htmlControl.Attributes["src"]?.ToUpper()
              .Contains(jsRelativePath.ToUpper())) return;
        }
    }

    HtmlGenericControl Include = new HtmlGenericControl("script");
    Include.Attributes.Add("type", "text/javascript");
    Include.Attributes.Add("src", page.ResolveUrl(jsRelativePath));
    page.Header.Controls.Add(Include);    
}
Другие вопросы по тегам