jQuery操作HTML代码方法介绍
更新时间：2022年05月04日 11:40:17 作者：.NET开发菜鸟
这篇文章介绍了jQuery操作HTML代码的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
html()可以对HTML代码进行操作，类似于元素JavaScript中的innerHTML。
例如：
示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>html()操作</title>
<style>
*{
margin: 0px;
padding: 0px;
}
input{
display: block;
float: left;
}
</style>
<!--引入jQuery-->
<script src="../jquery-3.3.1.js"></script>
<!--javascript-->
<script>
$(function(){
$("#btnGet").click(function(){
var html=$("div.left").html();
alert(html);
});
$("#btnSet").click(function(){
var html=$("div.left").html("<div style='border:1px solid red;'><p>这是一个段落</p></div>");
});
});
</script>
</head>
<body>
<div id="mainbox">
<h1>飘飞雨絮</h1>
<div class="left">
<img src="../qq.jpg" width="150" height="150"/>
<br />
</div>
</div>
<input type="button" id="btnGet" value="获取html()内容" style="margin-right:10px;" />
<input type="button" id="btnSet" value="单击改变内容" />
</body>
</html>效果：
到此这篇关于jQuery操作HTML代码的文章就介绍到这了。希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
本文给大家分享的是使用原生JS和JQ两种方法分别实现相同的图片轮播特效，十分的实用，也非常方便大家对比学习原生js和jQuery，有需要的小伙伴可以参考下。2015-04-04
这篇文章主要为大家介绍了一款非常棒的jQuery图片轮播效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-04-04
这篇文章主要介绍了 jquery如何取得元素标签名称，将html和js代码附上，具体操作步骤大家可查看下文的详细讲解，感兴趣的小伙伴们可以参考一下。2017-08-08
jQuery+vue.js实现的九宫格拼图游戏完整实例【附源码下载】
这篇文章主要介绍了jQuery+vue.js实现的九宫格拼图游戏,结合完整实例形式分析了jQuery结合vue.js针对图片的相关操作技巧,需要的朋友可以参考下2017-09-09
这篇文章主要介绍了jQuery实现ajax回调函数带入参数的方法,结合实例形式对比分析了jQuery实现ajax回调函数不带入参数与带入参数的具体实现技巧,需要的朋友可以参考下2018-06-06
这篇文章主要介绍了jQuery实现简易商城系统项目实操，文章围绕主题展开详细的内容介绍，具有一定的参考价值，感兴趣的小伙伴可以参考一下2022-06-06
解析jQuery的三种bind/One/Live事件绑定使用方法
本篇文章主要是对jQuery的三种bind/One/Live事件绑定使用方法进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
jQtransForm jQuery表单美化修饰插件，附带有PHP提交程序，当然ASP/ASP/NET/JSP都是同理，这里主要是jQuery美化部分的实例，美化对象为文本框、密码框、文本域、Select下拉框、按钮等，有了这些示例，美化其它的表单元素应该不是大问题。2012-07-07
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
下面小编就为大家带来一篇jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法。2017-05-05
本篇文章详细概述了jQuery选择器的作用并对其进行了实例解析，有助于理解与学习。文章通过对jQuery选择器进行分类的形式进行一一介绍，有助于理解与记忆，希望通过对本文的阅读对大家有所帮助2016-11-11
最新评论