If you enabled the PHP excellent error reporting there would have been error messages and warnings displayed which could have been copied and pasted into your browser. No doubt there would be thousands of solutions available to immediately try to solve the problem.
The errors I should imagine would state that the script tag is not PHP script or something like that.
Try this:
<?php
// this is PHP script
?>
<!-- this is HTML script -->
<script>
jQuery("section#title").append(<?php the_title( '<h1 class="product_title entry-title">', '</h1>' );?>);
</script>
<?php
// more PHP script
// not required to close PHP script if there is no more HTML script ?>
I want to offer some advice from personal experience. Although it is quite possible to write PHP code that puts together HTML - which may include JavaScript tags with variables that have been assigned values from PHP - in various ways such as echoing HTML, going in-and-out of PHP, includes, etc. the code can get very messy and very difficult to work with very fast.
Although it can be debated how to go about it and what is “best”, I think it is a good idea to keep things separated enough so that they are less confusing and less prone to mistakes. It is only natural that after an approach is found that works in simple uses to scale that same approach for more complex code. But depending on how attentive one is to details and how much work they want to invest in working with the code, at some point what worked for the simple will break down when used for the more complex.
Anyway tl;dr, I think if you keep the mixing of PHP and HTML to a minimum you’ll have a much better time of it.
I agree unfortunately it is a necessary evil with data driven sites so I have adopted the following practice which I think is far easier to read and also to debug. This is where most of a programmer’s time is spent
<?php
// this is PHP script
// BEWARE: NO SPACES OR TEXT AFTER OPENING ____TMP
// and
// BEWARE ONLY LINEFEED ALLOWED AFTER CLOSING ____TMP;
// REQUIRES TESTING
$title = 'the_title( "<h1 class="product_title entry-title">', '</h1>' );
$tmp = <<< ____TMP
<!-- this is HTML script -->
<script>
jQuery("section#title").append( $title );
</script>
____TMP;
echo $tmp;
// more PHP script
// not required to close PHP script if there is no more HTML script ?>
Also, even better would be use a templating engine like Twig and don’t mix HTML and PHP at all.
One step further is to only use <script src="..."></script> and stop using inline scripts altogether, which has the added advatage that you can omit unsafe-inline from your content security policy reducing the chances of an XSS attack by a lot.
I have used heredoc for a long time and for me it simplifies scripts when there are a lot of functions, variables, constants, etc to be rendered in HTML:
I have never used Twig and believe it is some sort of library which adds an unnecessary overheard and extra processing which PHP heredoc does a lot simpler.
**Edit:**
Your example using **HEREDOC** and without curly braces:
```
# PREPARE VARIABLES
$title = 'hello world';
$body = 'Normally obtained from database table ';
$foot = 'Normally obtained from database table ';
Where are your calls to html_entities? Twig does that for me to help prevent XSS (and it never forgets!), but your heredoc is wide open to XSS attacks.
Also there is some overhead using Twig, but not a lot since everything is parsed to plain php the first time a template is rendered, and then reused the next time you render it.
There is also some stuff in Twig, like blocks and embed for template inheritance that would be a lot harder in plain PHP.