Как в php вставить javascript
Перейти к содержимому

Как в php вставить javascript

  • автор:

Как вставить HTML, CSS и JS в PHP-код?

Когда вы разрабатываете свой модуль, то иногда прибегаете к помощи верстки (HTML и CSS) и дополнительным скриптам.

Все это можно подключать отдельно – что-то в теле страницы, что-то в отдельных файлах. Но некоторые дополнения лучше вставлять непосредственно в сам PHP-файл.

Сегодня я покажу два варианта, как можно вставить HTML, CSS или JavaScript в код PHP.

Первый вариант вставки элементов в PHP-код

Я думаю, что если вы хоть немного знакомы с PHP, то знаете, что такое «echo» (тег, с помощью которого вы можете вывести сообщение на экран).

Вот с помощью него и можно вывести один из перечисленных ранее кодов. Пример:

   "; echo $content; ?>

На что здесь стоит обратить внимание? Кавычки. Если вы используете внешние кавычки в виде » «, то внутренние кавычки элементов должны быть ‘ ‘ и наоборот, иначе вы получите ошибку. Если вы принципиально хотите использовать одинаковые и внешние, и внутренние кавычки, то во внутренних ставьте знак экранизации:

   "; echo $content; ?>

В этом случае все будет работать корректно.

Второй вариант вставки элементов в PHP-код

Этот вариант мне нравится куда больше, чем первый. Здесь мы будем также использовать «echo», как и в предыдущем варианте, но добавим еще элемент «HTML»:

  .main { color: red; >  HTML; ?>

Сюда вы можете вставлять любой элемент, будь то HTML-код или же JavaScript. Кавычки здесь не играют роли (можете вставить любые), а по желанию можно внедрить переменные для вывода:

 "; echo    HTML; ?>

Весьма удобный способ для реализации ваших идей.

JS код в php файле?

Доброго утра. На сколько я знаю, php файл не скачивается и не читается в браузере. Поэтому его сложно своровать. Что, если код js поместить в файл php?

Подскажите пожалуйста шаг за шагом, как это сделать? И как он будет указан в html страничке? Вероятно через инклуд, но как это правильно делается? Спасибо.

  • Вопрос задан более трёх лет назад
  • 8553 просмотра

2 комментария

Простой 2 комментария

ArtC @ArtC Автор вопроса

А если js вставить или перевести в node.js? Он то ведь на сервере выполняется?

Как файл js перевести в node.js? И достаточно ли будет залить этот node.js на хостинг?

Palych_tw

node.js никак вам не выполнит код, который должен выполниться в браузере у клиента. Вам нужно понять эту разницу между сервером и клиентом, server-side и client-side, бэкенд и фронтенд — называйте как хотите.

Сейчас ваш вопрос по смыслу идентичен — как выполнить HTML или CSS на сервере. Никак, этот код обрабатывается браузером.

PHP и JavaScript

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

В языках PHP и JavaScript предусмотрены разные объектные системы обозначений. В языке JavaScript используется так называемая уточняющая запись через точку в стиле C#, тогда как в языке PHP используются стрелки, иначе говоря, система обозначений в стиле C++. Язык JavaScript полностью объектно-ориентирован, тогда как в языке PHP объекты рассматриваются как необязательное средство. Такое различие систем обозначений имеет свое преимущество в том, что невозможно когда-либо спутать объект JavaScript с объектом PHP, или наоборот. А недостатком является то, что отсутствует возможность обратиться к одному и тому же объекту из обоих языков.

Курс PHP для начинающих

Вывод кода JavaScript с помощью сценария PHP

Язык PHP является серверным (поскольку для интерпретации кода на этом языке используется серверное приложение), а язык JavaScript — клиентским (аналогичное замечание), поэтому может показаться, что при использовании того и другого языка в одном и том же сценарии формирования страницы будут возникать проблемы. Но в действительности именно благодаря указанному различию эти два языка хорошо дополняют друг друга.

Безусловно, язык PHP обладает большими возможностями по созданию динамически формируемых веб-страниц, но PHP — исключительно серверный язык. К тому же есть одна общая категория задач, решаемых на веб-сайте, для которых чаще всего не требуется вся обрабатывающая мощь сервера, и поэтому эти задачи быстрее и проще решаются в клиентском программном обеспечении. К таким задачам, например, относится изменение внешнего вида кнопки при перемещении над ней курсора мыши. Для решения многих подобных задач можно легко применить язык JavaScript, который представляет собой чисто клиентский язык (безусловно, имеется и серверная версия этого языка, но предполагается, что для этой цели уже выбран язык PHP) и легко интегрируется с языком PHP.

С другой стороны, клиентский язык JavaScript сам по себе характеризуется многими ограничениями. Например, будучи клиентским языком, JavaScript не позволяет организовать непосредственное взаимодействие с базой данных, поэтому сценарии JavaScript не способны обновлять сами себя путем получения новых данных, зависящих от условий просмотра страницы.

Еще более важный недостаток состоит в том, что невозможно полностью полагаться на клиентские технологии, поскольку язык поддержки этих технологий может оказаться не установленным или запрещенным в браузере пользователя. Сознательные разработчики клиентских приложений для веб вынуждены либо выбирать вариант реализации кода наугад (и получать жалобы от пользователей менее распространенных браузеров), либо одновременно сопровождать несколько версий одного и того же сайта. (Несознательные разработчики просто берут за основу все возможности браузера, наиболее распространенного в среде пользователей, и, как один старый моряк, говорят: «К черту торпеды. «, но это — совсем другая история.) Язык PHP позволяет смягчить эффекты, связанные с неопределенностью поддержки клиентского программного обеспечения.

Широкие возможности вывода данных в языке PHP

Одной из наиболее важных особенностей языка PHP является то, что с его помощью можно обеспечить вывод кода в различных форматах. В частности, PHP может применяться (и применяется) для вывода открытого текста, кода HTML, XHTML, JavaScript, XML, MathML, файлов в различных графических форматах, кода CSS, XSL и даже (что трудно сначала представить себе) кода ASP.NET.

Кроме того, нет каких-либо реальных технических сложностей, которые не позволяли бы выводить с помощью языка PHP код C, хотя, по-видимому, такой способ применения PHP не находит слишком широкого распространения. Следует помнить, что язык PHP не используется исключительно для вывода кода HTML — конечным продуктом применения этого языка обычно становится код, предназначенный для обработки другим приложением, обычно браузером.

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

'; ?>  

Но этот пример не демонстрирует наилучший способ формирования кода JavaScript в сценарии PHP. Гораздо удобнее формировать основной объем кода определения функций JavaScript в элементе HTML-страницы и просто вызывать эти функции в элементе , используя для формирования этих вызовов главным образом язык PHP.

Как и при формировании в сценарии PHP кода HTML, в некоторых случаях код JavaScript можно формировать, не выходя из режима PHP. К тому же подобный стиль организации работы сценариев PHP может соответствовать личным предпочтениям разработчика. В этом случае для вывода кода JavaScript может использоваться оператор echo или print языка PHP, как в следующем примере:

   Еще один блок кода PHP EOT; ?>

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

Области применения языка JavaScript

Клиентский код JavaScript не обладает чрезвычайно большими функциональными возможностями, но позволяет быстрее решать некоторые задачи, а также создавать такие эффекты, которые довольно сложно воспроизвести с помощью PHP. Ниже перечислены такие функциональные средства кода, которые действительно следует дополнить или заменить в коде HTML-страницы функциями JavaScript:

  • Простые арифметические операции в формах и калькуляторах (такие как вычисление промежуточной суммы по товарам, собранным в тележку для покупок, и расчет платежей по ипотечной задолженности).
  • Простая проверка правильности формы (например, определение наличия символов @ в адресах электронной почты).
  • Реализация средств навигации сайта (например, создание разворачивающихся меню навигации).
  • Создание всплывающих меню (предупреждений, окон поиска).
  • Обработка событий, обнаруживаемых в браузере (mouseover, onclick).

Курс PHP для начинающих

Резервирование функциональных средств кода JavaScript с помощью кода PHP

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

Если в браузере посетителя будет разрешено применение языка JavaScript, то посетитель получает возможность воспользоваться более быстрым методом. В противном случае применяется менее быстрый, резервный метод, но обычно посетители даже не замечают, что в коде сайта реализуется подобный выбор. А если бы не было возможности вместо кода JavaScript переходить к использованию кода PHP, то пользователи браузера без поддержки JavaScript были бы полностью лишены доступа к функциональным средствам сайта.

Идеальным примером резервирования кода JavaScript с помощью кода PHP является дважды зарезервированное разворачивающееся меню для навигации по страницам сайта без использования ссылок. Код JavaScript обеспечивает мгновенное перенаправление, а если в браузере не разрешено использование JavaScript, то в действие вступает код PHP, с помощью которого достигается такой же результат, но после более продолжительного ожидания.

В этом примере взят за основу тот факт, что в коде JavaScript имеются обработчики событий (например, onchange), которые выполняют свои действия в результате прохождения курсора над элементами формы HTML, поэтому фактически не требуют передачи данных формы щелчком на кнопке. Это означает, что кнопка Submit может быть зарезервирована для использования в коде PHP. В примере ниже показан сценарий формирования HTML-страницы, в котором используется перенаправление с помощью события onchange языка JavaScript, а если этот код не работает, то применяется обработчик формы PHP:

Обработка формы с помощью JavaScript

    Основы PHP       

В файле обработчика формы PHP, называемом redirect.php, достаточно предусмотреть только две строки:

$category = $_POST['category']; header("Location: $category");

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

Сравнение методов статического и динамического формирования кода JavaScript

Безусловно, статическая форма JavaScript — PHP, приведенная в примере выше, удобна для использования во многих приложениях, но она имеет один существенный недостаток — ее приходится сопровождать вручную. Каждый раз, когда потребуется добавить новую страницу к сайту, необходимо будет вспоминать о том, что ссылку на эту страницу необходимо ввести вручную в код формирования раскрывающегося списка. На первый взгляд может показаться, что в этом нет ничего особенного, но из массы таких мелочей складывается невероятно трудоемкая работа, когда приходится сопровождать огромный сайт с интенсивным трафиком.

Используя язык PHP в сочетании с базой данных, вы можете обеспечить автоматическое обновление определенной части кода JavaScript каждый раз после ввода новых данных в базу данных, иначе говоря, обеспечить динамическое обновление. К достижению такой цели следует стремиться при любой возможности, поскольку в долговременном плане это помогает экономить время. В примере ниже показано, как можно модифицировать форму, чтобы обеспечить лучшую интеграцию клиентского и серверного кода:

Исходная страница с динамически генерируемой формой

    Основы PHP            

Несомненно, читатель уже понял, что аналогичный метод может оказаться буквально бесценным, даже если создается простая форма JavaScript (например, такая, в которой используется обработчик событий onsubmit, а не onchange). В частности, этот метод позволяет модифицировать вызовы обычных функций JavaScript, поскольку язык PHP позволяет изменять значения переменных в вызове функции, до того как код этого вызова будет отправлен в браузер. Поэтому при желании сценарии PHP могут использоваться непосредственно для вывода кода JavaScript, в котором предварительно осуществляется подстановка значений переменных, взятых из какого-то источника данных.

Курс PHP для начинающих

Передача данных в обратном направлении, из кода JavaScript в код PHP

Наконец, рассмотрим, как завершить цикл обработки данных, снова передав значения формы в код PHP из кода JavaScript. В примере ниже показано, как использовать код JavaScript, для передачи в сценарий PHP простого объекта:

Передача объекта из кода JavaScript в код PHP с использованием формата JSON

 $value) < echo ''.$key.' => '.$value.'
'; > > ?> Основы PHP

Безопасность PHP и XML

Курсы javascript

Через РНР на клиенте ничего не вызывается. Если эту кнопку нужно вывести по условию на сервере, значит jquery.prettyPhoto.js должен формировать и отдавать клиенте интерпретатор.

28.05.2017, 12:08
Регистрация: 21.02.2016
Сообщений: 271

смотрите, если бы верстка всплывающего окна была в обычном php файле я бы просто туда добавил код в нужное место:

и у меня бы эта кнопка вызывалась. а в js файл я php добавить не могу (или не умею).
В приведенном выше js коде есть строчка которая вызывает «родные» кнопки без использования php

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

28.05.2017, 13:14
Регистрация: 14.01.2015
Сообщений: 12,990

Кнопки соцсетей а данном плагине определяются конфигурацией. Если вам нужно добавить к этим кнопкам свою, которая определяется неким условием на сервере, то кроме сервера ее никто в код не добавит. Запрашивать .js файл при этом совсем не обязательно как

это может быть запрос к php-файлу, который отдаст серверу данный скрипт, добавив в него кнопку:

header(‘Content-type: text/javascript’); $pp_social = условие ? ‘html-код кнопки’ : »; include ‘. jquery.prettyPhoto.js’; //и в этом файле в нужном месте
29.05.2017, 16:44
Регистрация: 21.02.2016
Сообщений: 271
А как мне это практически реализовать?
вот есть у меня в файле jquery.prettyPhoto.js такая строчка:

if(settings.social_tools)< facebook_like_link = settings.social_tools.replace('', encodeURIComponent(location.href)); $pp_pic_holder.find('.pp_social').html(facebook_like_link); >

..если я меняю html(facebook_like_link) на html(‘12345678’) то у меня в лайтбоксе отображается 12345678.. а что мне нужно вставить что бы отобразился результат действия php

Извиняюсь, что так неграмотно все объясняю и спрашиваю. но очень надо — третий день уже ничего не могу сделать ((

29.05.2017, 16:52
Регистрация: 14.01.2015
Сообщений: 12,990

Ну я же писал как. Заменить в моем примере строку 2 на

$pp_social = function_exists('wp_ulike') ? wp_ulike('get') : null';

А вывод (в примере строка), перенести в файл js (строка 3)

$pp_pic_holder.find('.pp_social').html( );

Но это будет неправильно — facebook_like_link, это все определенные в плагине соц. кнопки. А надо html-код своей кнопки добавить к html-коду определенных.

29.05.2017, 17:16
Регистрация: 21.02.2016
Сообщений: 271

$pp_social = function_exists('wp_ulike') ? wp_ulike('get') : null';

А вывод (в примере строка), перенести в файл js (строка 3)

$pp_pic_holder.find('.pp_social').html( );

А разве я могу в файл js php-код вставлять
29.05.2017, 17:17
Регистрация: 21.02.2016
Сообщений: 271
что-то пока не получается. ((
а разве можно в js файл php-код вставлять?
29.05.2017, 17:31
Регистрация: 14.01.2015
Сообщений: 12,990

Конечно, только в данном случае, это вставка РНР кода не в js-файл, а в вывод — include ‘path/jquery.prettyPhoto.js’; поместит файл в поток, парсер его обработает и выполнит в нем РНР код.

Вставку не в этом месте делать надо, а там где описывается html-код кнопок. Кроме этого, в css файлах (а их несколько, так как в плагине можно менять темы) описать и стиль добавляемой кнопки.

29.05.2017, 22:36
Регистрация: 21.02.2016
Сообщений: 271

самое обидное, что там на самом деле все наверное достаточно просто — если я в медиафайлах (cms wordpress) вставляю в title вместо текста шорт-код плагина Ulike [wp_ulike] (насколько я понимаю, это тоже самое что и просто вызов php функции плагина, только для используется в самом тексте) — то у меня эта кнопка появляется вместо названия (правда только при просмотре единичных изображений, в галерее отображается текстом [wp_ulike]). т.е. получается, что проблема в том, что я не могу правильно задать переменную $pp_social где-то в php файлах, что бы js понял ее как html-код и отобразил в окне? ((

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *