ajax使用html()后样式无效,jquery.ajax使用字符串拼接后内联css样式失效
时间: 2024-03-23 22:36:41 浏览: 246
css样式无效是怎么回事?有哪些常见原因?
这是因为通过 html() 方法或字符串拼接方式添加的 HTML 代码中的样式是动态添加的,浏览器在渲染时可能会出现问题。解决这个问题的方法是,可以通过以下两种方式来添加样式:
1. 使用 jQuery 的 append() 方法,将 HTML 代码添加到指定的 DOM 元素中。这样添加的元素会被浏览器正确解析,样式也会生效。
2. 使用动态创建的 CSS 样式表,将样式以 CSS 的形式添加到页面中。这种方式需要使用 jQuery 的 append() 方法将样式表添加到 head 标签中,然后再通过类名或 ID 等方式将样式应用到指定的元素上。
举个例子,如下代码可以解决使用字符串拼接方式内联样式失效的问题:
```javascript
var html = "<div class='myClass'>这是一个例子</div>";
var style = "<style>.myClass{color:red;}</style>";
$('head').append(style);
$('body').append(html);
```
这样添加的元素样式就可以生效了。
阅读全文