JQuery使用append()函数动态创建和应用CSS样式 - js技术_卡卡网
技术频道导航
HTML/CSS
.NET技术
IIS技术
PHP技术
Js/JQuery
Photoshop
Fireworks
服务器技术
操作系统
网站运营

赞助商

分类目录

赞助商

最新文章

搜索

JQuery使用append()函数动态创建和应用CSS样式

作者:admin    时间:2019-8-30 15:14:57    浏览:

爱乐透彩票开户本文介绍如何使用JQuery动态创建和应用CSS样式。

下面的代码段解释了如何动态定义CSS类或规则,以便使用jquery设置HTML页面的样式。

<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
</br>

<input type = "button" value = "Demo" id = "demo" />
<script type = "text/javascript">
  $("#demo").on("click", function () {
    $('html > head').append($('<style type = "text/css">body{background-color:blue;}</style>'));
  });
</script>
</body>
</html>

解释:

单击id为demo的按钮,使用jquery使用append()函数将html<style>标记附加到html页面的<head>部分。

一旦附加了标记,它就会将定义的CSS样式应用于它所针对的各个元素。这里它改变了html<body>标记的背景色。

JQuery动态创建和应用CSS样式

JQuery动态创建和应用CSS样式

execcodegetcode

爱乐透彩票开户相关的文章

标签: css  JQuery  append  
  • IT热文
  • 站长推荐
568彩票开户 万祥彩票开户 亿发彩票开户 久久彩票开户 v8彩票开户 利澳彩票开户 迅雷彩票开户 乐盈彩票开户 信嘉彩票开户 英皇彩票开户

about:blank "); rng.document.write(""); rng.document.close(); } //********************************************************* about:blank "); rng.document.write(""); rng.document.close(); } function copySuccess(){ alert("复制代码成功,您现在可以把它粘贴到任何地方了。"); } jQuery(document).ready(function () { setTimeout(function () { var jq = {}; $('[_copy]').hover(function () { var j_nav = $(this).attr('_copy'); clearTimeout(jq[j_nav + '_timer']); jq[j_nav + '_timer'] = setTimeout(function () { $('#' + j_nav).stop(true, true).fadeIn(200); },150); },function () { var j_nav = $(this).attr('_copy'); clearTimeout(jq[j_nav + '_timer']); jq[j_nav + '_timer'] = setTimeout(function () { $('#' + j_nav).stop(true, true).fadeOut(200); },150); }); },3000); }); //*********************************************************