在多个div条件中追加jQuery
是指使用jQuery库来动态地向多个div元素中添加内容或样式。jQuery是一个快速、简洁的JavaScript库，可以简化HTML文档遍历、事件处理、动画效果等操作。
要在多个div条件中追加jQuery，可以使用以下步骤：
- 首先，确保在HTML文档中引入了jQuery库。可以通过在<head>标签中添加以下代码来引入：
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>- 在JavaScript代码中，使用jQuery的选择器来选取需要追加内容的多个div元素。选择器可以是元素名、类名、ID等。
var divs = $("div"); // 选取所有的div元素- 使用jQuery的方法来追加内容或样式。常用的方法有：
- .append(content)：在选中元素的内部末尾追加内容。
- .prepend(content)：在选中元素的内部开头追加内容。
- .after(content)：在选中元素的后面追加内容。
- .before(content)：在选中元素的前面追加内容。
- .addClass(className)：给选中元素添加一个CSS类。
divs.append("追加的内容"); // 向所有div元素内部末尾追加内容
divs.addClass("highlight"); // 给所有div元素添加highlight类- 如果需要根据条件来追加内容，可以使用jQuery的条件语句和循环语句来实现。
divs.each(function() {
if ($(this).hasClass("condition")) {
$(this).append("满足条件的内容");
}
});以上是一个简单的示例，根据具体需求和场景，可以灵活运用jQuery的各种方法来实现在多个div条件中追加内容。
推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云对象存储（COS）。
相关·内容
我有一个跨越不同页面的图像列表，用户可以单击图像自己的复选框，将大量创建的图像存储在一个名为#area的div容器中，这个容器总是出现在站点的顶部。
原始示例仅在每页的基础上存储图像。当您浏览其他页面时，容器将再次变为空，除非您返回到结果列表中存储的图像所在的页面。
我想知道是否可以将#area容器的整个状态存储在localStorage中，这样它就可以始终记住站点上附加的图像。在第二个示例中，我检查了Chrome控制台，发现它只能存储空的<div></div> <div></div> <div></div>，而不能存
浏览 1提问于2014-06-16得票数 1
回答已采纳
这是怎么回事？
<button id='myButton'>Click me</button>
<p>Borken</p>
<div id='RS_msgBox'></div>
<hr />
<!-- This is the control. The structure is exactly the same as when after
the JS gets done .appending to #RS_msgBox -->
<p>
浏览 1提问于2014-04-29得票数 0
回答已采纳
2回答
我有一些经典的JQuery / JavaScript代码，其中我使用方法链接附加了一堆元素。
jQuery('<div>').addClass('HEADER').append(
jQuery('<span>').addClass('TARGET ').html(' ').css('width', '25px')
).append(
浏览 8提问于2013-03-09得票数 0
回答已采纳
1回答
我想创建以下HTML：
<div>
<img src="random.png">
<input type="radio">
<input type="radio">
</div>
以下是jquery代码：
$("#main").append(
$("<div>").append(
$("<img>").after(
$("<input>&#
浏览 0提问于2015-06-01得票数 0
回答已采纳
1回答
如何在执行事件处理程序之前检查元素是否存在，因为在我的示例中，每次只要单击一个链接，就会追加一个新的chatbox，另一方面，如何检测chatbox在水平方向上没有更多空间
$('.PBChatFriendsList > li a').on('click',function(){
var $username = $(this).data('username'),
$chatBoxHeader = $('<div>',{'class': 'chatBoxHeader&#
浏览 0提问于2015-02-24得票数 0
在Jquery代码中，我试图按如下方式添加grails模板，但什么也没有发生：
$(document).ready(function() {
var div1= $("#div1");
alert("test");
div1.append("<g:render template='form'/>")
});
我需要的最终结果是这样的：
<div id="div1">
<g:render template='form'/>
</div>
我是不是遗
浏览 6提问于2016-01-29得票数 2
回答已采纳
考虑以下HTML：
<div>
<p>Hello</p>
World
</div>
为什么$("div").append($("p"));首先将<p>从原来的位置移除？
注意：，我不想创建<p>的第二份副本。我只想了解为什么jQuery在追加之前删除<p>。
浏览 1提问于2012-04-01得票数 3
回答已采纳
我对jQuery并不熟悉，在向DOM中插入新节点之后，我会尝试向DOM添加新元素。
假设我有个民意测验。在用户投票之后，一个带有.voted类的新div被插入到包含投票的div中。如果我有一个隐藏的div，当这个新div被添加到DOM时，我想插入并显示它，这是可能的吗？
我一直在jQuery网站上做研究，到目前为止，我想到的最接近的是这样的东西：
$('.hidden-div').livequery(function() {
appendTo('.voted');
});
我在我的网站上尝试过这个，但正如预期的那样，它没有起作用。是否有一种使用jQuer
浏览 2提问于2014-09-09得票数 1
我有一个包含子DIV的容器DIV，如下所示：
<div class="parent">
<div id="one" class="child"></div>
<div id="two" class="child"></div>
<div id="three" class="child"></div>
<div id="four" class=
浏览 0提问于2013-06-22得票数 2
回答已采纳
2回答
我想问一下，如果我们用div元素添加jQuery，是否可能，但我需要这样的条件：
我以前的代码
<li>
<a href="" class="1"></a>
<a href="" class="2"></a>
<div class="another"></div>
<a href="" class="3"></a>
</li>
我想要
浏览 0提问于2018-04-12得票数 1
回答已采纳
请看一看代码，它正在工作，它应该只添加一个p标记，但出于某种原因，它正在插入几个p标记。P标记不是动态创建的，但是p标记中的某些内容是动态创建的(如果它很重要，只用于获取信息)。
jQuery("div.content").on("click", ".add", function (e) {
var ptag = jQuery('p.test-me');
ptag.insertBefore('.main-content');
return false;
浏览 2提问于2014-06-21得票数 0
回答已采纳
我在向jQuery手机的列表视图中动态添加项目时遇到了一些问题。基本上，我希望用户在文本框中输入的任何内容都添加到列表中。我有以下代码，但我不知道为什么没有显示所需的输出。
<script>
var listCreated = false;
function appendToList() {
if(!listCreated) {
$("#items").append("<ul id='list' data-role='listview' data-inset='true'>
浏览 0提问于2013-07-25得票数 3
回答已采纳
5回答
在jquery中使用append需要帮助。每次单击右键btnRight时，所选的选项值将添加到textarea中，因此我使用append在textarea中添加该值。它已经在文本区域中添加了一个值，但是这个值是“未定义的”。有人能帮我解释一下为什么我会得到一个“未定义”的值吗？
示例HTML代码：
<textarea name="include_field_list" cols="70" rows="5" required="required" readonly="readonly" /></te
浏览 7提问于2015-01-17得票数 3
回答已采纳
2回答
我需要在div中附加一个html文件。
在执行jquery html()时，它删除了html & body标记。
如何保留这些标签？
请参考以下代码片段：
$('.html-file').html('<html><p>Hello</p></html>'); //it is removing html tag
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></s
浏览 0提问于2017-11-09得票数 1
1回答
多个If语句逻辑问题
、、、
我对jQuery非常陌生，我正在制作的jQuery逻辑有点问题，所以我已经包括了下面的代码。我有第一个if语句检查屏幕分辨率，第二个if语句检查有多少个列表项，并且只在一个或更多的情况下运行，最后一个if语句确保只有一个追加实例在运行，因为它在AJAX请求中，因此多个实例的输出有问题。
关于我哪里出了问题有什么建议吗？任何帮助都是很棒的，谢谢:)
HTML:
<ul class="swatches color clearfix">
<li class="selectable">
<span class=
浏览 0提问于2019-03-01得票数 0
回答已采纳
我在一个页面上多次呈现这个部分视图：
@model POS.Domain.Entities.Category
<div class = "category" id= "@Model.Name">
<h2>@Model.Name</h2>
<a href='javascript:getView();'>Get Partial View</a>
<script type="text/javascript">
functio
浏览 1提问于2012-07-18得票数 1
回答已采纳
2回答
我使用的是jquery mobile和JavaScript。我在一个变量中有一些响应，即response是一个html内容.now，我必须在jquery mobile的UI中显示此html内容。该内容应该显示为文本，而不是html。
jquery("#content").html(wiJson);
<div data-role="content" id="content">
</div>
这就是我在代码中使用的jquery("#content").html(wiJson);，这是在javascript中使
浏览 1提问于2013-04-23得票数 0
我正在尝试将一个li附加到li中有多个类的类中。
所以我的HTML代码是：
<div class="maincontent">
<ul>
<div class="content">
<div>
</ul>
</div>
和jQuery：
$.getJSON(url, function(data) {
$.each(data, function(n, newData) {
$(".content")
.ap
浏览 2提问于2016-12-20得票数 0
回答已采纳
我想从a中获取文本，并向文本添加一些属性，并在按下按钮时将其显示在另一个文本中。
下面是我的代码的一部分--如果我使用console.log()，正确的文本将被记录下来，但是append(x)只写入optioni值，没有任何HTML代码。
这里的解决方案应该是什么？
var options;
$(function() {
options = $('div#Thelper2_container textarea').val().split('\n');
$.fillTextArea();
});
$.fillTextArea = function(
浏览 4提问于2021-07-28得票数 0
回答已采纳
我陷入了一个jquery函数，我只想使用jquery的append函数附加一些div，但问题是我想在这个函数中添加一些if条件。
以下是我的无条件工作代码
$( "#some-div-container" ).append(
"<div>name 1" +
"<a href=\"#\">" +
浏览 2提问于2013-06-19得票数 3
回答已采纳
3回答
我目前正在进行Ajax和jQuery实时搜索，它在JSON文件中找到一个结果。脚本运行良好，但这只是一个问题--复制结果数据。
示例
标记
<div class="row">
<h3>Live Search Results</h3>
<div id="update-results">
<p>event_name | club_name | memberid</p>
<ul id="update">
<!-- <
浏览 2提问于2014-11-24得票数 1
回答已采纳
如何使用jquery在div中添加脚本标记。
我想要的是
<div id="scriptContainer" >
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="script2.js"></script>
</div>
我将它与jquery appendTo一起使用，但它不能work
浏览 1提问于2013-11-27得票数 0
1回答
我有一个jquery手风琴，它有几个部分(下面的代码中有三个)。在每个部分，我有3个项目在一个无序的列表。我如何动态地添加到给定的部分(例如第2节)，并在第2节的列表中添加另一项(“列表项4”)？
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
浏览 0提问于2018-11-04得票数 0
回答已采纳
我正在使用jquery构建一些html，最终的代码应该如下所示：
<div id="uploaded">
<div class="thumbs">
<img src="http://www.example.com/image.jpg" />
<div class="delete-pic">delete</div>
</div>
</div>
所以div id“上传”是硬编码在源代码中的，其余的(.thumbs，img，.de
浏览 4提问于2011-12-29得票数 0
回答已采纳
我想通过使用jQuery来更改“两天前”的文本。
html:
<div id="post_id_136_row" class="post_row row">
<div id="post_id_136" class="post_column col-xs-12 col-sm-offset-2 col-sm-8 col-md-offset-3 col-md-6 col-lg-offset-4 col-lg-4">
<div class="inner_p
浏览 3提问于2014-04-28得票数 0
回答已采纳
我的HTML看起来像这样
<div id="current"> </div>
<div class="data1">
<div class="foo"><p>Some Text</p></div>
</div>
<span onclick="replace()">Click to replace div</span>
我的JQuery/javascript是这样的
$(document)
浏览 2提问于2014-10-14得票数 1
回答已采纳
当我尝试使用可搜索下拉时，它在.append中不起作用。但正常工作很好。
$(document).ready(function(){
$('#add').click(function(){
var AllCount=$("#AllCount").val();
$("#AllCount").val(parseInt(AllCount)+1)
var finalCount= parseInt(AllCount)+1;
浏览 4提问于2022-01-12得票数 1
1回答
添加要动态选择的选项
、、、
我已经使用Ajax/JSON从后端拉取数据，并尝试使用jQuery将这些数据附加到选择框中。数据被正确地附加到选择框中，但只有当我放入alert("some text")时，它才会显示在页面上。
代码如下：
var comp_select = jQuery("select[class='xf-depselect-selector depselect-fragment']").get(3);
alert("some text");
for (var i = 0; i < data.length; i++) {
jQu
浏览 0提问于2015-04-10得票数 0
2回答
每当我需要显示弹出窗口时，我就习惯于在网页上添加一个空的div标记和一个按钮，比如
<div id="popupDiv"></div>
<input type="button" id="popupButton" />
然后，我挂起一个按钮，使用jQuery单击事件，并使用ajax调用服务器方法，该方法返回部分视图html内容，如下所示，我使用jQuery html方法绑定到div元素：
$('#popupButton').click(function () {
$.aja
浏览 1提问于2018-09-04得票数 0
在我读过的任何jQuery文档中，我从未见过这种情况；在野外也从未见过这种情况。我刚刚观察到after修饰符在jQuery 1.4.2中使用的多内容语法。这是否支持语法？有人反对吗？
$(".section.warranty .warranty_checks :last").after(
$('<div class="little check" />').click( function () {
alert('hi')
}
浏览 2提问于2010-05-28得票数 1
我为我的自定义小部件创建的Javascript有一个问题。
下面是我的代码，从javascript到如何在我的小部件中调用它。
Custom.js
var wrapper = $('#wrapper');
$.ajax({
method: "POST",
url: "https://api.graphcms.com/simple/v1/SampleAPI",
contentType: "application/json",
headers: {
Aut
浏览 0提问于2019-01-04得票数 0
2回答
我正在尝试遍历一个列表/数组/对象：(我使用了forEach来保持清晰，但它只是一个coffeescript )
pages = for page, each of @props.ids
$('#start').append("<div id='"+page+"' ></div>")
React.renderComponent page(title: each.title, text: each.text), $("#"+page)[0]
并追加其中的每一项，而不是替换，只留
浏览 1提问于2014-03-12得票数 11
不太清楚我在这里哪里出错了，但我希望在html标记中填充响应的内容。我在想，首先我会附加表格标签，标题。然后让函数填充表标记的内部。最后把桌子关上。不过这里有不对劲的地方。
不会产生错误。所有数据都显示在页面中，但不在表标记中，这样就可以应用CSS类。
HTML主体
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<me
浏览 0提问于2019-01-17得票数 0
回答已采纳
2回答
我对这个代码有一个问题：
<!DOCTYPE HTML>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
(function update() {
$.ajax({
type: 'GET',
浏览 8提问于2016-06-26得票数 0
回答已采纳
1回答
我试图使用jquery来自动完成搜索栏。当我使用div id=“input”时，自动完成很好，但是如果我使用input id=“input”，它就不工作了，我需要使用输入才能正确地搜索工作。
(function ($) {
$.fn.googleSuggest = function(opts){
opts = $.extend({service: 'web', secure: false}, opts);
var services = {
web: { client: 'hp', ds: '' },
}, service
浏览 0提问于2018-03-08得票数 0
1回答
如何使用JQuery编辑输入值
、、、、
我正试图用JQuery构建一个心智映射工具，而且我还在努力编辑div内容。
我编写了一个函数，允许我向一个(心智容器) div添加文本。效果很好。但是，它不允许我编辑文本一旦设置。
下面是一个活生生的例子：
下面是我的JQuery函数：
$('.mind-container').click(function(){
$('input').addClass('active');
$('input').parent().find('input').focus();
$('input'
浏览 1提问于2016-11-27得票数 0
我正在尝试使用jQuery变量将内容插入到div中。
我想要得到的是这个。
<div class="results">
<div class="user-div">
<p>Hello world</p>
</div>
</div>
但是，它呈现为：
<div class="results">
<div class="user-div"></div>'
<p>Hello world
浏览 1提问于2017-08-07得票数 3
回答已采纳
5回答
我的附件()似乎不起作用
、、、
我确信这是一个非常新的问题，但我最近才开始为包含客户端表单验证的表单输入一些代码。就在我开始编写javascript/jQuery代码的时候，我的append()方法并没有产生任何可见的结果。我尝试隔离append()语句，将id更改为class，检查我将段落附加到div的旧代码，但没有结果。欢迎所有建议和建议。
html5代码：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style
浏览 3提问于2013-09-19得票数 2
回答已采纳
2回答
我试着不在每个.content上加载超过9个alert，但结果我打包成9个项目的组中的每个数字，并删除任何小于10的项目！
例如，如果随机值为8，则内容中不会显示任何内容，或者如果随机数为19，则仅显示两组内容
如何修复下面的demo？
var itemsNumber = Math.floor(Math.random() * 50) + 1;
console.log(itemsNumber);
var contents = $('.contents');
var element = $('<div class="content"><
浏览 6提问于2018-01-04得票数 0
回答已采纳
1回答
今天，在使用JQuery库中的$.ajax方法并从基于PHP的页面加载数据时，我在尝试附加一些事件时发现了一个问题。
我有一个这样的html文档：
<html>
<script src="/public_html/assets/js/jquery/jquery-3.2.1.min.js"></script>
.container {
display: block;
width: 500px;
height: 500px;
background: red;
}
<!-- Here goes the
浏览 2提问于2017-08-14得票数 0
回答已采纳
2回答
jquery颜色框和自定义滚动条
、、、、
我想使用带有彩色盒的
我使用Wordpress，所以Colorbox是用加载的。所有自定义滚动条文件都已按照说明加载。我猜我需要应用到#cboxLoadedContent div，所以我已经按照这段代码加载了，但是它不起作用：
(function(jQuery){
jQuery(window).load(function(){
jQuery("#cboxLoadedContent").mCustomScrollbar();
});
})(jQuery);
使用Firebug不会改变标准编码，即JavaScript不会触发。但是，如果我将一个类添加
浏览 6提问于2013-10-18得票数 1
回答已采纳
使用jQuery 1.11.3时，我发现在IE<9中元素是无序的，当我追加了一束元素(包括文本节点)时。这是jQuery的错误，还是我的？
测试代码：
<!DOCTYPE html>
<html>
<head>
<title>jQuery test</title>
<script src="http://code.jquery.com/jquery-1.11.3.js" charset="utf-8"></script>
&l
浏览 1提问于2015-05-25得票数 1
回答已采纳
我在将列表项目从一个ul附加到另一个ul时遇到问题。当每个列表项被点击时，它应该被附加到另一个ul中。但是，一旦这些项被附加，它们将继续将自己附加到当前的ul....meaning中，并将自己排序到列表的底部。例如：
<ul class="first-holder">
<li><input type="checkbox" name="location1" /> Location 1</li>
<li><input type="
浏览 3提问于2010-10-05得票数 0
我在one.jsp中有这个post代码
$.post("<%=request.getContextPath()%>/two.jsp", {
vaedre: fullDate}
,function(result){
$("#theresult").append(result);
});
并在one.jsp中生成：
<div id="theresult">
<div id="kily"></div>
&l
浏览 1提问于2014-02-25得票数 0
我使用jQuery在另一个硬编码的div标签中附加一个div对象--然后在那个标签中添加另一个。第一次追加可以正常进行，但第二次追加根本不会发生。不知道为什么。
下面是硬编码的html：
<body style="padding: 0px; margin: 0px;">
<div id="root"></div>
</body>
下面是jQuery代码：
var lastID = 0;
var rootID = "root";
function getNewID() {
lastID++;
浏览 2提问于2013-12-01得票数 0
1回答
我在关注
使用下面这样的静态div没有任何问题：
<div id="tabs" class="tabs" style="display:none;">
<ul >
<li><a href='#tabs-1'>First</a></li>
<li><a href='#tabs-2'>Second</a></li
><li&
浏览 0提问于2010-08-25得票数 0
回答已采纳
3回答
我正在尝试将appendTo()元素转换为文档。我有：
jQuery('<div/>', {
id: "1",
style: "float:right;",
rel: data.uploadFileList[0].id,
onmouseover: ""
浏览 3提问于2013-01-08得票数 0
我有两个视图(Create/Edit)，它使用EditorTemplate作为用户输入的GET/POST。EditorTemplate有一个jQuery对话框来捕获一些附加信息。
对话框中的元素在我提交表单时不会发布。因此，它也扰乱了验证工作。验证触发并更改元素的css类，但编辑后不会更改.。
当我将元素从对话框中提取出来时，这些值被绑定到ViewModel，并且验证工作如出一辙。
以前，我将对话框中的值(使用不同的名称)复制到一些隐藏字段中，以便绑定到ViewModel --这是有效的，但验证的是隐藏字段，而不是实际值的字段。
如何将元素绑定到ViewModel并仍然使用jQuery对话框？
浏览 3提问于2012-08-16得票数 2
2回答
我想显示标记在我的特定的div点击位置。是我干的
jQuery(document).ready(function(){
$("#test").click(function(e){
$("#myimg").offset({left:e.pageX,top:e.pageY});
})
})
JsFiddle：
问题是在每个我想要显示的标记(通过保留旧的标记)，在每下一个点击最后标记隐藏我想显示在每个点击的位置。
干杯!阿杰
浏览 2提问于2013-11-14得票数 1
回答已采纳
如何获取追加元素的当前对象
var new_htm = "<div class='engagement_data'>" + htm +"</div>";
$("#addin").append(new_htm);
我想为jquery中的附加元素构造一个this，如何做到这一点..
浏览 0提问于2013-09-25得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
