Блог

Главная - Вопросы по программированию - теги скрипта и ссылки внутри условия if else в javascript?

теги скрипта и ссылки внутри условия if else в javascript?

#javascript #reactjs

#javascript #reactjs

Вопрос:

Здесь я создаю новый проект в своем новом проекте index.html Я сделал приведенный ниже код для сборки проекта. теперь у меня есть две команды для запуска проекта

 1. npm run admin-watch
2. npm run web-watch

Теперь я хочу создать проект с учетом условия if-else, если расширение admin затем разрешить создавать условие if else else condition. но как разрешить использование нескольких тегов скрипта и тега ссылки внутри условия if в javascript?

index.html

 let pathname = window.location.pathname;
let splitPath = pathname.split('/')[1];
if(splitPath === admin){
  <link rel="stylesheet" href="/build/web/css/style.css">
  <script src="/build/web/js/index.js" type="text/javascript"></script>
  <script src="/build/web/js/manifest.js" type="text/javascript"></script>
  <script src="/build/web/js/vendor.js" type="text/javascript"></script>
}else{
  <link rel="stylesheet" href="/build/admin/css/admin.css">
  <script src="/build/admin/js/admin.js" type="text/javascript"></script>
  <script src="/build/admin/js/manifest.js" type="text/javascript"></script>
  <script src="/build/admin/js/vendor.js" type="text/javascript"></script>
}

Комментарии:

1. javascript / html работает не так

2. это для реакции в соответствии с тегами? используйте тернарный оператор вместо if else

3. @JoeWarner что ты сказал, я не понимаю? как решить эту проблему

4. @AZ_ можете ли вы помочь мне использовать оператор ternery

5. см reactjs.org/docs/conditional-rendering.html

Ответ №1:

Для того, что вам нужно, есть обходной путь, который заключается в вызове функции во время выполнения, которая вставляет соответствующий тег скрипта на основе вашего условия:

 function loadMyScripts(){
    let pathname = window.location.pathname;
    let splitPath = pathname.split('/')[1];
    if(splitPath === admin){
      let link = document.createElement('link');
      link.rel = "stylesheet";
      link.href = "/build/web/css/style.css"
      document.head.appendChild(link);

      let scriptOne = document.createElement('script');
      script.src = "/build/web/js/index.js";
      script.type = "text/javascript";
      document.head.appendChild(scriptOne);

      // the rest of the scripts have the same approach, just change src and type attribute
    }else{
      //create more element objects with other attributes and append them to the head as above
    }
}