需要准备的材料分别有:电脑、html编辑器、浏览器。
1、首先,打开html编辑器,新建html文件,例如:index.html。
2、在index.html中的<script>标签,输入js代码:$('head').append('<style>div{font-size: 32px}</style>')。
3、浏览器运行index.html页面,此时发现js成功将css代码添加到<head>标签的<style>标签中。
style也可以看做普通的HTML节点,因此其创建方法与jQuery创建普通元素的方法相同,关键代码:
$("<style></style>").text("div#test{color:red}").appendTo($("head"))下面实例演示——点击按钮创建新的style样式:
1、HTML结构
<div id="test">这是示例的DIV</div><input type="button" value="创建新的<style>">
2、jQuery代码
$(function(){$("input[type='button']").click(function() {
$("<style id='test_style'></style>").text("div#test{color:red}").appendTo($("head"))
$("div#test").html($("div#test").text() + "<br>" + $("#test_style").text())
})
})
3、效果演示
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)