动态地将元素添加到div并设置css样式

Id='a';  
linkId = '#dialog_link' + Id; 

htmlCode = '<p><a href="#" id="' + linkId + '" class="ui-state-default ui-corner-all"><span></span>Open Window</a></p>';   
$('#WindowsContainer').append(htmlCode); 

$(linkId).css('padding: .4em 1em .4em 20px;text-decoration: none;position: relative;'); 
$(linkId + ' span.ui-icon').css('margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;');

最后两行不会影响ID为“dialog_linka”的样式。动态地将元素添加到div并设置css样式

来源

2011-10-22 os ip

试试这个：

$(linkId).css({ 
    padding: ".4em 1em .4em 20px", 
    "text-decoration": "none", 
    position: "relative" 
});

你可能想重新读取the API并检查$.css()接受哪种值。

编辑：如果它不工作，那是因为你还没有创建的HTML正确：

htmlCode = '<p><a href="#" id="' + linkId + '" ...'

因为linkId是"#dialog_linka"，id属性是id="#dialog_linka"，当它应该是dialog_linka（不哈希值）。

另外，至少在示例代码中，您没有任何类.ui-icon的元素。

参见http://jsfiddle.net/YDYA6/进行演示。

来源

2011-10-22 11:52:12 JJJ

对不起，没有工作，只有工作，如果预定义的元素在HTML，但如果由JS创建的元素（没有工作）。 ..感谢 –

这是因为你给该元素一个无效的ID。见编辑的答案。 – JJJ

感谢第一行工作成功，但第二个样式$（linkId +'span.ui-icon'）不工作，其中ui-icon类定义（我相信这一点）。很多感谢Juhana –

你需要通过你的CSS参数作为地图属性值对的 -

$(linkId).css({'padding': '.4em 1em .4em 20px','text-decoration': 'none;position: relative'});

看到这里的文档 - http://api.jquery.com/css/

来源

2011-10-22 11:51:30 ipr101

您正在使用css功能错误。

它应该是：

$(linkId).css({ 
    'padding': '.4em 1em .4em 20px', 
    'text-decoration': 'none', 
    'position': 'relative' 
});

来源

2011-10-22 11:52:22 realshadow

对不起，没有工作，只有在html中预定义的元素，但如果由js创建的元素（NOT WORKED）...感谢 –

那是因为你将id设置为'#dialog_link'+ Id，而html id元素无法启动使用散列符号，它应该是'dialog_link'+ Id。 – realshadow

尝试this.You可以添加样式属性，而不是使用的CSS功能。

Id='a';  
linkId = 'dialog_link' + Id; 

htmlCode = '<p><a href="#" id="' + linkId + '" class="ui-state-default ui-corner-all"><span class="ui-icon"></span>Open Window</a></p>';   
$('#WindowsContainer').append(htmlCode); 

$("#"+linkId).attr("style",'padding: .4em 1em .4em 20px;text-decoration: none;position: relative;'); 
$(linkId + ' span.ui-icon').attr("style",'margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;');

来源

2011-10-22 13:57:09

使用样式集从jquery中创建元素。

var id = 2; 
var link = $('<a/>',{ 
    id:'dialog_link' + id, 
    class: 'ui-state-default ui-corner-all', 
    text: 'Open Window', 
    css:{ 
    padding: '.4em 1em .4em 20px', 
    'text-decoration': 'none', 
    position: 'relative' 
    } 
})

演示 Jsfiddle

参考 - Creating element from jquery

来源

2015-07-29 06:39:40 Anenth

动态地将元素添加到div并设置css样式

回答

相关问题