Думаю, ваша цель - идентифицировать элемент в каком-то другом сценарии.для этого мы можем использовать атрибут данных элемента, используя jQuery
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<div id="first-id" style="width:300px;height: 100px;background-color: #536dfe"></div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function () {
// to SET the custom id
$("#first-id").attr('data-second-id', 'second-id');
// to GET the custom id
console.log($("#first-id").attr('data-second-id'));
// even if you want object you can stringify that object and set the value using jquery;
var obj = {"first": 'Some data 1', "second": 'Some data 2', "third": 'Some data 3'};
$("#first-id").attr('data-custom-data-object', JSON.stringify(obj));
console.log($("#first-id").attr('data-custom-data-object'));
// to access the object values
var get_data_object_values = JSON.parse($("#first-id").attr('data-custom-data-object'));
var first = get_data_object_values.first;
var second = get_data_object_values.second;
var third = get_data_object_values.third;
console.log(first);
console.log(second);
console.log(third);
});
</script>
Наконец, если вы хотите выбрать элемент для некоторых манипуляций, вы можете использовать пользовательский атрибут
// will give you the width of the element
console.log($('*[data-second-id="second-id"]').css("width"))