<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<div class="c1">

    <p>pppp</p>

</div>

<button>dd</button>

<script src="jquery-3.3.1.min.js"></script>

<script>

    $('button').click(function () {

        // 方式一：给div添加标签h1以及内容

        $('.c1').append('<h1>wwwe</h1>');

        // 方式二：给div添加标签h1以及内容

        var $ele=$('<h1></h1>');

        $ele.html('hehh');

        $ele.css('color','red');

        $('.c1').append($ele)

    })

</script>

</body>

</html>

jQuery添加标签实例的更多相关文章

  1. 添加标签2 jquery 和JS

    TAG添加标签 做了个方法方便调用 一.JS版本 <!DOCTYPE html> <html lang="en"> <head> <met ...

  2. jQuery输入框回车添加标签特效

    效果如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  3. JQuery添加删除标签

    <!DOCTYPE html><html><head> <meta charset="UTF-8"> <script src= ...

  4. jQuery操作标签

    jQuery操作标签 样式操作: 对标签的样式进行修改,那么操作样式的方法是什么? 样式类: addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类名 ...

  5. JS添加节点方法与JQuery添加节点方法的比较及总结

    原生JS添加节点方法与JQuery添加节点方法的比较及总结   一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div ...

  6. Jquery 添加插件

    原文:http://www.iteye.com/topic/545971 jQuery插件的开发包括两种: 一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法 ...

  7. jQuery对标签、类样式、值、文档、DOM对象的操作

    jquery的标签属性操作 使用attr()方法对html标签属性进行操作,attr如果参数是一个参数,表示获取html标签的属性值,如果是两个参数则是设置标签属性名以及对象的属性值 .prop()适 ...

  8. JS添加标签效果

    JS添加标签效果 在豆瓣网上添加自己的标签是一种常见的效果,今天也就做了一个简单的demo.由于时间的问题 我不多原理,大家可以试着操作几遍就能明白其中的原理了. JSFiddle的效果如下: 点击我 ...

  9. jQuery对象合并、jQuery添加静态方法、jQuery添加DOM实例方法

    实例效果: 代码演示: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...

随机推荐

  1. jquery实现除指定区域外点击任何地方隐藏DIV

    <!--弹出的表情选择框--> <div class="layui-input-block expression-box"> </div> &l ...

  2. Monte Calro Tree Search (MCTS)

    https://blog.csdn.net/natsu1211/article/details/50986810, 感谢分享! Intro最近阿法狗和李师师的人机大战着实火了一把,还顺带捧红了柯杰,古 ...

  3. C语言二级指针（指向指针的指针）

    转载:http://c.biancheng.net/cpp/html/85.html 指针可以指向一份普通类型的数据,例如 int.double.char 等,也可以指向一份指针类型的数据,例如 in ...

  4. 我的C语言连接Mysql之路

    1.安装好mysql     2.要实现C连接数据库,需要安装数据库连接器(即MySQL Connector/C)    MySQL Connector/C是一个C语言的client库,这个库是为了实 ...

  5. google学习

    https://developers.google.com/machine-learning/crash-course/ https://developers.google.com/machine-l ...

  6. Python学习---django惰性机制

    Django惰性机制 所谓惰性机制:Publisher.objects.all()或者.filter()等都只是返回了一个QuerySet(查询结果集对象),它并不会马上执行sql,而是当调用Quer ...

  7. [日常]蒟蒻的高一生活 Week 1~3

    博主在三周前成功晋级为高中生OwO终于不再是假的HZOIer感受一波HZ的真正生活...(然而实际上级部不少监督一直没启动23333) (然而三周过去好多事情都忘了QAQ瞎写好了(逃)) Week 1 ...

  8. scala当中的Actor并发编程

    注:Scala Actor是scala 2.10.x版本及以前版本的Actor. Scala在2.11.x版本中将Akka加入其中,作为其默认的Actor,老版本的Actor已经废弃. 1.什么是Sc ...

  9. linux环境下 C++性能测试工具 gprof + kprof + gprof2dot

    1.gprof 很有名了,google下很多教程 g++ -pg -g  -o test test.cc ./test   //会生成gmon.out gprof ./test > prof.l ...

  10. VNC Viewer

    首先需要明确,什么事VNC , Virtual Network Computing ,VNC允许Linux系统可以类似实现像Windows中的远程桌面访问那样访问Linux桌面. 首先试试服务器装了V ...