Форум программистов, компьютерный форум, киберфорум
Наши страницы
jQuery
Войти
Регистрация
Восстановить пароль
 
masli
45 / 12 / 9
Регистрация: 27.03.2013
Сообщений: 546
1

Создание элементов страницы с jQuery

17.01.2019, 15:26. Просмотров 340. Ответов 4
Метки нет (Все метки)

Вот так создаю страницу

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <meta charset="utf-8" />
    <!--jQuery-->
    <link rel="stylesheet" href="css/style.css">
    <script src="jquery/jquery-3.3.1.js"></script>
    <script src="js/script.js"></script>
    
</head>
<body>
 
</body>
</html>
js


Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
$(document).ready(function () {
 
    makeDiv();
 
});
 
var selectorDiv = "selectorDiv";
var htmlValue = "Создание элемента div";
 
/*Создание элемента div и применения стилей*/
function makeDiv() {
 
    createDiv(selectorDiv, htmlValue);/*создание элемента div*/
    applyStyle("." + selectorDiv, { "color": "green" }); /*добавление стиля на указанный селектор*/
    applyStyle("." + selectorDiv, { "border": "solid 2px blue" });
    applyStyle("." + selectorDiv, { "width": "300px" });
    applyStyle("." + selectorDiv, { "height": "50px" });
    applyStyle("." + selectorDiv, { "border-radius": "15%" });
}
 
/*Создание элемента div c указанным селектором и текстом внутри блока div*/
function createDiv(selector, html) {
    var div = '<div>';
    $(div, { class: selector, html: html }).appendTo('body');
}
 
 
/*Применение стиля*/
function applyStyle(selector, style) {
    $(selector).css(style);
}
Загрузка страницы происходит нормально, все рисуется как задумано(1-й рис).

Когда страницу сохраняюю и пытаюся запустить с локального диска, то после загрузки страницы, элементы дублируются.

Так что же, рисование элементов страницы на jquery - это не очень удобно и не везде применимо ?
Тогда в каких случаях его можно применять?

Или же этот эффект можно побороть?
0
Миниатюры
Создание элементов страницы с jQuery   Создание элементов страницы с jQuery  
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
17.01.2019, 15:26
Ответы с готовыми решениями:

Подсчитать количество элементов на страницы jQuery
Здравствуйте! У меня такая ситуация. На странице расположено к примеру 5 элементов с...

Как правильно передавать селектор при рисовании элементов страницы с применением jquery
$(function () { addBblockPage(&quot;.blockWindow&quot;); }) function...

JQUERY, размер страницы!
как сэкономить на размере страницы, ведь когда мы подключаем jquery, мы плюсуем к размеру...

Прокрутка страницы средствами jquery
Здравствуйте друзья. Подскажите, пожалуйста, как средствами jquery или css сделать так, чтобы при...

Jquery. При клике перекидывает к началу страницы
При клике появляется скрытый div, но при этом перекидывает к началу страницы. Использую show( ),...

4
Уф
637 / 609 / 380
Регистрация: 13.07.2015
Сообщений: 1,839
Завершенные тесты: 1
17.01.2019, 16:27 2
усе просто. при сохранении страницы она сохраняется браузером именно в том виде котором выглядит сейчас, то есть браузер тупо вписал весь html код созданый скриптом в файл
HTML5
1
<div class="selectorDiv" style="color: green; border: 2px solid blue; width: 300px; height: 50px; border-radius: 15%;">Создание элемента div</div></body></html>
это ты можешь увидеть откыв сохраненную копию блокнотом, то что страницы сохраненые с сайтов могут неправильно работать обычно никого не волнует, ибо неча контент тырить
1
masli
45 / 12 / 9
Регистрация: 27.03.2013
Сообщений: 546
17.01.2019, 18:30  [ТС] 3
Ну а если это закрытая база данных для внутреннего пользования и заказчик захочет, чтобы страницы можно было сохранять, тогда нужно frontend писать на чистом html , имеется ввиду создание элементов или это вообще не практикуется и никто в производственной среде не беспокоится о таких вещах ?
0
Уф
637 / 609 / 380
Регистрация: 13.07.2015
Сообщений: 1,839
Завершенные тесты: 1
17.01.2019, 19:42 4
практикуется, для этого пишутся страницы на php, они создаются сервером и отдаются пользователю, никаких скриптов в них нет, код получается похож на лапшу, например так
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE HTML>
<html>
<head>
<title>Админ - test</title>
<? include(__DIR__ . "/conn.php"); ?>
<style>
#tblTest td, #tblSql tr td { white-space: nowrap; }
</style>
</head>
<body>
<div style="height:200px;overflow:scroll;"><table border=1 id="tblSql">
<?php
    $user = 'root';
    $pass = 'root';
    $err = false;
    try {
        $dbh = new PDO('mysql:host=localhost;dbname=test_db;charset=utf8', $user, $pass);
        $dbh->setAttribute( PDO::ATATTR_EMULATE_PREPARESTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
        $result = $dbh->query("SELECT * FROM PRODUCTS");
        $result->setFetchMode(PDO::FETCH_ASSOC);
    } catch (PDOException $e) {
        print "Error!: " . $e->getMessage() . "<br/>";
        $err = true;
    }
    if($err==false) {
        echo '';
        foreach($result as $row) {
            echo '<tr>';
            foreach($row as $cell) echo '<td>'.$cell.'</td>';
            echo '</tr>';
        }
    
    }
}
?>
</table></div>
сервер сам соединится с базой и сформирует код таблицы в которым будут результаты запроса, но это очень примитивный пример конечно.
Можно испльзовать готовый фреймворк, например этот
https://www.yiiframework.com/doc/guide/2.0/ru/intro-yii
https://www.yiiframework.com/doc/guide/1.1/ru/quickstart.first-app
Или написать свой класс для работы с базой и вывода таблиц, если приложение простое, можешь в гугле набрать "php crud" там будут разные примеры, это простейшее приложение для работы с таблицами базы
1
Уф
637 / 609 / 380
Регистрация: 13.07.2015
Сообщений: 1,839
Завершенные тесты: 1
18.01.2019, 09:15 5
если это работа с базой то конечно удобнее не страницы сохранять, а таблицы в эксель сохранять, для этого подойдет и плагин на js, например этот https://datatables.net/
0
18.01.2019, 09:15
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
18.01.2019, 09:15

Не подключается jQuery при первом посещении страницы
Привет. На сайте есть фотогалерея и при нажатии на фотку открывается лайтбокс. Проблема в том, что...

Прилепания футера к низу страницы средствами javascript jquery
Всем добрый день. Задача состоит в том, чтобы на страницах, где мало контента, футер находился...

Выполнение jQuery после сабмита формы(перезагрузки страницы)
У меня есть форма регистрации, которая при сабмите отправляет данные на сервер с asp.net и...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.
Рейтинг@Mail.ru