Estoy tratando de agregar un div a un td en una table . Sin embargo, como estoy agregando el div, primero quiero tomar el ancho del cliente del td (para tener en cuenta diferentes tamaños de pantalla) y luego establecer el ancho del div para que sea ese ancho:
var tdWidth = document.getElementById("someId").clientWidth; // ex: 165 td.append("<div Div1 style='margin:auto; width:150px;'><div msg style='color:red'>" + "Text, Text, Text" + "</div></div>");Ahora estoy tratando de aplicar el valor 165 a Div1 (donde el ancho está actualmente codificado a 150 px; no quiero codificarlo sino configurarlo dinámicamente), pero no tengo idea de cómo hacer esto, traté de hacer cosas como:
$('Div1').width(tdWidth);y
var tdWidthPx= tdWidth + 'px'; $('Div1).css("width",tdWithPx);Idealmente, me gustaría establecer el ancho a medida que lo agrego para que cuando se muestre la identificación del texto, se muestre en el ancho correcto.
Gracias por adelantado.
No hay un atributo HTML llamado Div1 o msg . Por lo tanto, esto se convierte en HTML no válido.
Puede agregar el ancho de esta manera sin codificarlo inicialmente.
var tdWidth = document.getElementById("someId").clientWidth; // ex: 165 td.append("<div style='margin:auto; width:" + tdWidth + "px;'><div style='color:red'>" + "Text, Text, Text" + "</div></div>");O bien, puede asignar una identificación y luego cambiar el ancho según la identificación.
var tdWidth = document.getElementById("someId").clientWidth; // ex: 165 td.append("<div id='Div1' style='margin:auto; width:150px;'><div style='color:red'>" + "Text, Text, Text" + "</div></div>"); // giving an id to the div element(this id should be unique)El cambio el ancho usando el id.
var tdWidthPx= tdWidth + 'px'; $('#Div1').css("width",tdWithPx);Use el primer método si no está cambiando el ancho de div dinámicamente más adelante en el programa.