Why does wp_head hook my functions to the beginning of my source code, despite the fact that ‘wp_head’ appears in my code just before the tag.
Below is the source code
<php?
function load_css()
{
wp_register_style('bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css', array(), false, 'all' );
wp_enqueue_style('bootstrap');
wp_register_style('main', get_stylesheet_directory_uri() . '/css/main.css', array(), false, 'all' );
wp_enqueue_style('main');
}
add_action('wp_enqueue_scripts', 'load_css');
function load_js()
{
wp_enqueue_script('jquery');
wp_register_script('bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', 'jquery', false, true,);
wp_enqueue_script('bootstrap');
}
add_action('wp_enqueue_scripts', 'load_js');
?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name='robots' content='noindex, nofollow' />
<link rel='dns-prefetch' href='//s.w.org' />
<script type="text/javascript">
window._wpemojiSettings = {"baseUrl":"https://s.w.org/images/core/emoji/13.1.0/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/13.1.0/svg/","svgExt":".svg","source":{"concatemoji":"http://localhost/wordpress1/wp-includes/js/wp-emoji-release.min.js?ver=5.8.2"}};
!function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){var a=String.fromCharCode;p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,e),0,0);e=i.toDataURL();return p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,t),0,0),e===i.toDataURL()}function c(e){var t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji"),t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(!p||!p.fillText)return!1;switch(p.textBaseline="top",p.font="600 32px Arial",e){case"flag":return s([127987,65039,8205,9895,65039],[127987,65039,8203,9895,65039])?!1:!s([55356,56826,55356,56819],[55356,56826,8203,55356,56819])&&!s([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]);case"emoji":return!s([10084,65039,8205,55357,56613],[10084,65039,8203,55357,56613])}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventListener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"complete"===a.readyState&&t.readyCallback()})),(n=t.source||{}).concatemoji?c(n.concatemoji):n.wpemoji&&n.twemoji&&(c(n.twemoji),c(n.wpemoji)))}(window,document,window._wpemojiSettings);
</script>
<style type="text/css">
img.wp-smiley,
img.emoji {
display: inline !important;
border: none !important;
box-shadow: none !important;
height: 1em !important;
width: 1em !important;
margin: 0 .07em !important;
vertical-align: -0.1em !important;
background: none !important;
padding: 0 !important;
}
</style>
<link rel='stylesheet' id='wp-block-library-css' href='http://localhost/wordpress1/wp-includes/css/dist/block-library/style.min.css?ver=5.8.2' type='text/css' media='all' />
<link rel="https://api.w.org/" href="http://localhost/wordpress1/wp-json/" /><link rel="alternate" type="application/json" href="http://localhost/wordpress1/wp-json/wp/v2/pages/10" /><link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://localhost/wordpress1/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://localhost/wordpress1/wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 5.8.2" />
<link rel="canonical" href="http://localhost/wordpress1/" />
<link rel='shortlink' href='http://localhost/wordpress1/' />
<link rel="alternate" type="application/json+oembed" href="http://localhost/wordpress1/wp-json/oembed/1.0/embed?url=http%3A%2F%2Flocalhost%2Fwordpress1%2F" />
<link rel="alternate" type="text/xml+oembed" href="http://localhost/wordpress1/wp-json/oembed/1.0/embed?url=http%3A%2F%2Flocalhost%2Fwordpress1%2F&format=xml" />
</head>
<p>Hello</p>
<script type='text/javascript' src='http://localhost/wordpress1/wp-includes/js/wp-embed.min.js?ver=5.8.2' id='wp-embed-js'></script>
</body>
</html>
and this is what my header.php looks like
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<?php wp_head();?>
</head>