2016-09-26 5 views
0

У меня есть сайт, где этот блок HTML находится на всех страницах:Как я могу избежать повторения этого блока HTML?

<div class="about"> 
<p> <a href="google.com">lorem ipsum</a> </p> 
</div> 

Я хотел бы избежать повторения этого в HTML незашифрованном страницы, так что сайт становится более модульным/легче редактировать. Как мне это сделать? Естественным решением, вероятно, было бы объединение его в мою таблицу стилей CSS, но я не знаю, как это сделать.

+0

Положите его в MasterPage, который все страницы наследуют? –

+0

Что вы имеете в виду? вы надеетесь, что css покажет открытый текст? – Anan

+1

SHTML - это то, что вы могли бы рассмотреть. –

ответ

0

Я рекомендую вам использовать jquery, чтобы добавить эту html на каждой странице, например:

$('.blocks').append('<div class="about">'+ 
     +'<p><a href="google.com">lorem ipsum</a></p>'+ 
     +'</div>'); 
+3

И включить этот бит JavaScript в каждую страницу? –

+0

@MrLister yep, поместите этот код в глобальный файл 'js', который включен на каждую страницу, или модуль' header'. – Pedram

0

Если вы используете C# ASP.NET Вы можете перенести это содержимое в частичный вид. Таким образом, у вас есть один вид, содержащий этот контент, который вы можете сделать везде, где вы хотите, это:

@Html.Partial("yourView") 
0

Используйте функцию. Вам не нужно указывать на стороне серверов языков вы используете, так что я помещу пример на PHP:

<?php 
    function printAbout(){ 
     echo "<div class='about'><p><a href='google.com'>lorem ipsum</a></p></div>"; 
    } 
?> 

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

<?php 
    printAbout(); 
?> 

Обратите внимание, что стили, взимаемые на странице, которая печатает функция вступит в силу на нем, как вы harcoded его, так что нет необходимости добавлять CSS или JavaScript на функции, поэтому легче быть масштабируемым и редактируемым (и проще найти)

0

Если вы используете PHP, поместите его в файл sepperate .php, а затем включить его с помощью <?php include("path to the file.php"); ?>

0

Если вы используете php - с помощью частичного

about.php

<div class="about"> 
<p> <a href="google.com">lorem ipsum</a> </p> 
</div> 

основной. php

<?php include about.php ?> 
0

Вы можете положить его в файл HTML и использовать его на других страницах.

Использование JQuery:

a.html:

<html> 
    <head> 
    <script src="jquery.js"></script> 
    <script> 
    $(function(){ 
     $("#includedContent").load("yourNewPage.html"); 
    }); 
    </script> 
    </head> 

    <body> 
    <div id="includedContent"></div> 
    </body> 
</html> 

yourNewPage.html:

<div class="about"> 
<p> <a href="google.com">lorem ipsum</a> </p> 
</div> 

Для получения дополнительной информации, пожалуйста, проверьте этот link

Смежные вопросы