使用 jquery 将内联样式添加到动态生成的 div
[英]add inline style to dynamically generated div using jquery
问题描述
I am trying to add inline style to a div using jquery, following is the div as I inspect in firebug (attached below)
我正在尝试使用 jquery 向 div 添加内联样式，以下是我在 firebug 中检查的 div（附在下面）
I want to keep the existing CSS as well, I just have to add margin-left:0 and margin-right:0 to the existing class, following jquery I've tried but no luck:我也想保留现有的CSS ，我只需要在现有类中添加margin-left:0和margin-right:0 ，按照我尝试过的jquery但没有运气：
jQuery(document).ready(function($){
$(".testimonial_wrapper").css({'margin-left':'auto', 'margin-right':'auto'});
});
What are the other way to achieve?还有什么方法可以实现？ (please note that I am editing wordpress site and the divs are generated from page builders plugin) （请注意，我正在编辑 wordpress 站点，并且 div 是从页面构建器插件生成的）
3 个解决方案
解决方案1
1 已采纳 2016-09-27 14:02:07
I think you just have to erase the $ from function($) and change $ to jQuery in the function itself:我认为您只需要从function($)删除$并将$更改$函数本身中的jQuery ：
jQuery(document).ready(function(){
jQuery(".testimonial_wrapper").css({'margin-left':'auto', 'margin-right':'auto'});
});
解决方案2
0 2016-09-27 13:52:48
perhaps you can add inline css:也许你可以添加内联css：
<style type="text/css">
div.testimonial_wrapper {
padding-left : auto !important;
padding-right: auto !important;
}
</style>
the above will apply on new elements also but make sure it comes after the .css include以上内容也适用于新元素，但请确保它在 .css 包含之后出现
解决方案3
0 2016-09-27 14:11:09
i have added my own styles and your required styles also, with out disturbing the line styles我还添加了我自己的样式和您所需的样式，而不会影响线条样式
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ $("p").css("background-color", "yellow"); $(".testimonial_wrapper").css({'margin-left':'auto', 'margin-right':'auto'}); }); }); </script> </head> <body> <h2>This is a heading</h2> <p class="testimonial_wrapper" style="background-color:#ff0000;border:1px solid #000;">This is a paragraph.</p> <p class="testimonial_wrapper" style="background-color:#00ff00;border:1px solid #000;">This is a paragraph.</p> <p class="testimonial_wrapper" style="background-color:#0000ff;border:1px solid #000;">This is a paragraph.</p> <p>This is a paragraph.</p> <button>Set background-color of p</button> </body> </html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.