JavaScript动态添加css样式和script标签

关于JavaScript动态添加CSS样式和Script标签，具体步骤如下：

动态添加CSS样式

可以使用DOM创建一个新的style元素，然后将其插入到head标签中，代码如下：

// 创建style元素
var style = document.createElement('style');

// 设置样式内容
style.innerHTML = "p { color: red; }";

// 将style元素插入head标签
document.head.appendChild(style);

此代码段创建了一个样式内容为"p { color: red; }"的style元素，然后将其添加到了head标签中。实现了动态添加CSS样式。

另外，如果需要通过外部CSS文件动态引入样式，可以将新建的link元素添加到head标签中，代码如下：

// 创建link元素
var link = document.createElement('link');

// 设置link元素属性
link.rel = "stylesheet";
link.type = "text/css";
link.href = "style.css";

// 将link元素插入head标签
document.head.appendChild(link);

此代码段创建了一个指向外部CSS文件的link元素，并将其添加到head标签中。实现了动态引入外部CSS样式的效果。

动态添加Script标签

可以使用DOM创建一个新的script元素，然后将其插入到head或body标签中，代码如下：

// 创建script元素
var script = document.createElement('script');

// 设置script元素属性
script.type = "text/javascript";
script.src = "script.js";

// 将script元素插入head或body标签
document.head.appendChild(script);

此代码段创建了一个指向外部JavaScript文件的script元素，并将其添加到head标签中。实现了动态引入外部JavaScript文件的效果。

另外，如果需要在页面中直接添加JavaScript代码块，可以将JavaScript代码直接放在script元素里，代码如下：

// 创建script元素
var script = document.createElement('script');

// 设置script元素属性
script.type = "text/javascript";
script.innerHTML = "console.log('Hello, world!');";

// 将script元素插入head或body标签
document.body.appendChild(script);

此代码段创建了一个JavaScript内容为"console.log('Hello, world!');"的script元素，并将其添加到body标签中。实现了动态添加JavaScript代码块的效果。