実現したいこと
ブラウザ上でテキストを保存できるメモページを作成しています。
見出しにページ内リンクを付けたいのですが、ご教授頂けないでしょうか。
手順としましては、
0. 前のページで<form>に入力された内容をデータベースに保存
0. データベースのデータを呼び出して$postに格納
0. htmlspecialcharsで$post内のタグを無効化
0. str_replaceで[head1][/head1]を<h1 class="head1"></h1>に変換
0. juqueryでclass="head1"にid="headno●"(●は番号)を連番で付与
0. id="headno●"の付与された<h1>があれば、その中身を取得
0. <div class="title">の上に<div>を生成
0. 生成した<div>の中に、<ul><li></li></ul>でリスト化した6.の内容を全て書き出す
0. リストのそれぞれの項目が、指定のidの場所とページ内リンク
という流れです。
下記のコードで5.までは出来ましたが、6.で躓きましたので指定idの内容を取得する方法を教えて頂きたいです。
煩雑になってしまいましたが、ご回答お願いします。
php
1<?php 2session_start(); 3 4$id=$_GET['id']; 5 6$dsn='mysql:dbname=portfolio;host=localhost'; 7$user='root'; 8$password=""; 9$dbh=new PDO($dsn,$user,$password); 10$dbh->query('SET NAMES utf8'); 11 12$sql='SELECT*FROM memo WHERE id="'.$id.'"'; 13$stmt=$dbh->prepare($sql); 14$stmt->execute(); 15$rec=$stmt->fetch(PDO::FETCH_ASSOC); 16$dbh=null; 17 18$title=htmlspecialchars($rec['title']); 19$post=htmlspecialchars($rec['post']); 20 21$search = array("[head1]","[/head1]"); 22$replace = array("<h1 class='head1'>","</h1>"); 23 24$replacepost = str_replace($search,$replace,$post); 25 26?> 27 28<!DOCTYPE html> 29<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 30<script> 31 $(function(){ 32 $('.head1').each(function(i){ 33 $(this).attr('id','headno' + (i+1)); 34 }); 35 }); 36</script> 37 38<main class="page-main"> 39 <div class="main-inner"> 40 <div class="container page-container"> 41 <div class="title"> 42 <h2><?php print $title; ?></h2> 43 </div> 44 <div class="post"> 45 <?php print nl2br($replacepost); ?> 46 </div> 47 </div><!--container--> 48 </div><!--main-inner--> 49</main>
###試したこと
自分なりに調べて、試しに下記のjavascriptを使ってみた所、nullが帰ってきました。
javascript
1<script> 2 alert(document.getElementById("headno1")); 3</script>