Разделяйте числа с помощью div
Я работаю над простой таблицей, данные которой генерируются с помощью цикла, у меня проблема с генерацией случайных чисел. Я хочу, чтобы сгенерировали их самостоятельно, используя div ex. <td>09897</td> - <td><div>0</div><div>0</div><div>8</div><div>9</div><div>7</div></td> Мне как-то удается сгенерировать числа, но я не знаю, как их разделить.
Надеюсь, ты мне поможешь.
Спасибо
var dataNum = 30;
for (let t = 1; t <= dataNum; t++) {
$('table tbody').append('<tr>');
for (var j = 0; j < 2; j++) {
if (j == 0) {
$('table tbody').append('<td>' + todayDate() + '-' + deci(t) + '</td>');
} else if (j == 1) {
$('table tbody').append('<td>' + (Math.floor(Math.random() * 10000) + 90000) + '</td>');
}
}
$('table tbody').append('</tr>');
}
function todayDate() {
var d = new Date(),
month = '' + (d.getMonth() + 1),
day = '' + d.getDate(),
year = d.getFullYear();
if (month.length < 2) month = '0' + month;
if (day.length < 2) day = '0' + day;
return [year, month, day].join('');
}
function deci(number) {
var num = null;
if (number < 10) {
num = '000' + number;
} else if (number > 9 && number < 100) {
num = '00' + number;
} else if (number > 99 && number < 1000) {
num = '0' + number;
} else {
num = number;
}
return num;
}table th, table td{
width: 150px;
text-align: center;
}<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<thead>
<tr>
<th>Num</th>
<th>Random</th>
</tr>
</thead>
<tbody></tbody>
</table>
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
62
3
Перейти к ответу
Данный вопрос помечен как решенный
Ответы 3
Ответ принят как подходящий
Используйте эту функцию, чтобы преобразовать ваш сгенерированный номер в желаемый html, а затем вставить его в свой тег td (convert("09897", "div")):
function convert(num, tag){return "<"+tag+">"+(num+"").split("").join("</"+tag+"><"+tag+">")+"</"+tag+">"}
Итак, (Math.floor(Math.random() * 10000) + 90000) дает случайное число. Теперь вам нужна каждая цифра (которая будет доступна через .toString().split("")), а затем для каждой цифры вам нужно обернуть ее вокруг <div>, что можно сделать через .map(t => "<div>" + t + "</div>"). Затем вы можете соединить эти строки с помощью .join("").
var dataNum = 30;
for (let t = 1; t <= dataNum; t++) {
$('table tbody').append('<tr>');
for (var j = 0; j < 9; j++) {
if (j == 0) {
$('table tbody').append('<td>' + todayDate() + '-' + deci(t) + '</td>');
} else if (j == 1) {
$('table tbody').append('<td>' +
(Math.floor(Math.random() * 10000) + 90000)
.toString()
.split("")
.map(t => "<div>" + t + "</div>")
.join("") +
'</td>');
}
}
$('table tbody').append('</tr>');
}
function todayDate() {
var d = new Date(),
month = '' + (d.getMonth() + 1),
day = '' + d.getDate(),
year = d.getFullYear();
if (month.length < 2) month = '0' + month;
if (day.length < 2) day = '0' + day;
return [year, month, day].join('');
}
function deci(number) {
var num = null;
if (number < 10) {
num = '000' + number;
} else if (number > 9 && number < 100) {
num = '00' + number;
} else if (number > 99 && number < 1000) {
num = '0' + number;
} else {
num = number;
}
return num;
}table th,
table td {
width: 150px;
text-align: center;
}<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<thead>
<tr>
<th>Num</th>
<th>Random</th>
</tr>
</thead>
<tbody></tbody>
</table>Использованная литература:
Разделение строки # - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split
Присоединение к массиву # - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join
Массив # карта - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
var x=90987;
x=x.toString();
for(var y=0; y<x.length; y++)
{
console.info(x[y]);
}
Другие вопросы по теме
Загрузите файл при выборе файла через ajax и jquery в плагине wordpress
Использование компонента Vue js без веб-пакета
Остановить таймер после разъединения вызова в twilio php
Ответ json с отношениями в laravel blade
Оповещение JS вызывается кнопкой да из модального окна начальной загрузки
Добавление нескольких элементов к другим элементам jQuery JavaScript
Как принимать только числа, такие как integer и float, в значениях поля ввода с помощью jQuery
Как отформатировать doc.writeln без кавычек
Как изменить динамический атрибут на слайдере
Как получить данные таблицы Bootstrap и удалить строку
Похожие вопросы
Проверка петрушки не работает после изменения значения из dom
Не может обновить свойство объекта vue внутри обратного вызова успеха axios
Экспресс-функция вызывается несколько раз
Использование компонента Vue js без веб-пакета
Остановить таймер после разъединения вызова в twilio php
Как сделать диаграмму в реальном времени с помощью anychart?
2 Условное выпадающее меню в codeigniter
Vue.js и Laravel - как интегрировать vue js с laravel?
React Router не будет перенаправлять в зависимости от состояния
Путаница с оператором instanceof в javascript
Подумайте о добавлении пояснения к вашему коду, поскольку это не всегда самоочевидно.