Как менять id у элемента/блока
Подробно об изменении id в javascript.
Как изменять id в javascript.
Сначала попробуем понять, что такое изменить id в javascript.У некого элемента будет существовать id. У него будет какое-то значение - его мы будем менять.
Вдруг, вы, говоря изменить id, подразумеваете заменить id в javascript, ну например на class, то вам нужно:
Вполне возможно, что вам именно это и нужно!
Заменить id через javascript, на... пусть это будет класс.
Чтож - давайте это разберем в следующем пункте!
Заменить id на
Для того, чтобы заменить id на нам понадобится:Любой тег, пусть это будет div
Ему присвоим id
У него должно быть , какое-то значение "example"
Добавим немного стилей:
border: 1px solid red;
padding: 20px;
margin: 20px 0;
}
И поскольку мы решили заменить заменить id на , то нам понадобится какой-то класс в стилях
Чтобы его сразу можно было увидеть добавим этому у задний фон, пусть это будет зеленый.
Процесс замены id на
Чтобы мы могли увидеть вживую замену данного "id" нам понадобится:
Тег button.
Событие {onclick}.
Функция удаления атрибута removeAttribute
Добавление атрибута - setAttribute
Соберем код для замены id на
<style>
.example_class{background:green;}
div#example{
border: 1px solid red;
padding: 20px;
margin: 20px 0;
}
</style>
<div id="example">здесь текст с id </div>
<button onclick="my_foo()">Отправить</button>
<script>
function my_foo()
{
example.setAttribute("class", "example_class");
example.removeAttribute("id");
}
</script>
Результат замены id на
Для того, чтобы увидеть процесс замены id на , нажмите исследовать элемент и после этого нажмите на кнопку заменить id.Замена значения id на другое
Следующим пунктом разберем простую замену значения id.
Пробежимся очень быстро, что нам понадобится в этом случае!?
Где-то мы должны заменить id - возьмем опять div.
У нас будет два id, один с красным бордюром, второй с задним фоном.
border: 1px solid red;
padding: 20px;
margin: 20px 0;
}
#new_value_id{background:green;}
Кнопка, по которой будем нажимать:
И простой скрипт? в котором и заменим значение id с "example_2" на "new_value_id":
function my_foo_2()
{
example_2.id="new_value_id";
}
</script>
Соберем код замены id через javascript.
<style>
div#example_2{
border: 1px solid red;
padding: 20px;
margin: 20px 0;
}
#new_value_id{background:green;}
</style>
<div id="example_2">здесь текст с id </div>
<button onclick="my_foo_2()">изменить id</button>
<script>
function my_foo_2()
{
example_2.id="new_value_id";
}
</script>
Результат замены id через javascript.
Для того, чтобы увидеть процесс замены id через javascript, откройте исследовать элемент и далее нажмите кнопку "изменить id".Как видим, значение в id прекрасно заменяется через javascript.
javascript изменить id изменить id в css javascript js изменить id элемента