是否将html(文本)附加到元素而不影响同级？
将HTML文本附加到元素而不影响同级的方法是使用DOM操作来动态创建和插入元素。通过DOM操作，可以在现有的HTML文档中创建新的元素，并将其插入到指定的位置，而不会影响同级元素。
具体步骤如下：
- 创建一个新的元素节点：可以使用document.createElement()方法来创建一个新的元素节点。例如，要创建一个新的div元素，可以使用以下代码：var newDiv = document.createElement("div");
- 创建要附加的HTML文本：可以使用innerHTML属性来设置新元素的HTML内容。例如，要将HTML文本"<p>Hello World!</p>"附加到新的div元素中，可以使用以下代码：newDiv.innerHTML = "<p>Hello World!</p>";
- 插入新元素到指定位置：可以使用appendChild()方法将新元素插入到指定的父元素中。例如，要将新的div元素插入到id为"container"的父元素中，可以使用以下代码：document.getElementById("container").appendChild(newDiv);
通过以上步骤，可以将HTML文本附加到元素而不影响同级元素。这种方法常用于动态生成和插入内容，例如在响应用户操作或从服务器获取数据后更新页面。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：提供可扩展的云服务器实例，满足不同规模和需求的应用场景。详情请参考：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库 MySQL 版：提供高性能、可扩展的关系型数据库服务，适用于各种在线应用场景。详情请参考：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云对象存储（COS）：提供安全、稳定、低成本的云端存储服务，适用于存储和处理各种类型的文件和数据。详情请参考：https://cloud.tencent.com/product/cos
相关·内容
📷
我有一个场景，我想在其中Assert UI显示'Active‘。
在调试断言时，我尝试了不同的方法。
这就是我一开始的想法：
Assert.IsTrue(webdriver.Text.Contains("Active"))
但它正在抛出一个例外；
Assert.IsTrue failed
是否有正确验证UI是否显示Active的建议？
图片附呈以供参考。
浏览 0提问于2021-12-29得票数 0
我有一个带有TD的表行，每个TD元素都有'm-rowcell‘类，一些单元格通过使用’m-隐藏‘类来隐藏。
我需要选择最后的TD元素，这是没有‘m-隐藏’类，只使用CSS。
.m-hide {
display: none;
}
.m-rowcell {
border: 1px solid;
}
tr td:last-child { /*visible last child*/
background: #FFAA33;
}
<table style="width:100%;">
<tr class="m-row">
浏览 1提问于2015-11-12得票数 0
4回答
当一个名为patrick的用户在我今天早些时候给出的答案中指出了一个错误后，我就想到了这个问题。
给定以下html：
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script type="text/javascript">
$(function(){
浏览 0提问于2010-07-22得票数 2
回答已采纳
1回答
我正在使用JQuery来改变页面的不透明性，经过一定的延迟。问题是，我的弹出式也造成了这种不透明。
如何在没有div #popup-news的情况下将其应用于整个页面？
content.html：
<div id="popup-news">
[...]
</div>
style.css：
#popup-news {
width: 45%;
position: fixed;
left: 50%;
transform: translateX(-50%);
padding-top: 10px;
pa
浏览 1提问于2022-03-10得票数 1
回答已采纳
在下面的代码中，为什么$(data).find('#');在$(data).siblings('#');正常工作时返回null？
$.get("post.php", function(data) {
var new_data = $(data).find('#main_wrapper').html();
console.log(new_data); // returns NULL
var new_data = $(data).siblings('#main_wrapper').htm
浏览 2提问于2014-05-06得票数 1
回答已采纳
1回答
我正在尝试创建一个悬停事件，它不会影响我布局的其余部分。看起来z-index可以做到这一点，但是我不能让它工作。我试图坚持使用css，但是jQuery是可行的。
完整应用：
html
<div class="big-square" id="br">
<div class="little-square" id="br-tl"></div>
<div class="little-square" id="br-tr"></div>
浏览 1提问于2012-08-23得票数 1
回答已采纳
我是否可以使用CSS来设置一个元素的样式，如果它是同级的话，则取决于子类的类型？或者是它父母的兄弟姐妹的孩子？
例如，假设我有一张桌子：
<table>
<tr><td><span class='red'>A</span></td><td><span class='blue'>B</span></td></tr>
<tr><td><span class='red'>
浏览 1提问于2013-04-16得票数 0
1回答
我有一个名字列表，需要在中间用逗号返回，所以通常我只使用.join，但是列表中的一个项目需要有一个星号的图标在它旁边，如果满足了一个条件，它在联接中不能工作。是否有类似于我可以使用的连接，它不会将所有内容转换为字符串，从而显示HTML元素而不是返回'name、Object、object'？我试过使用dangerouslySetInnerHTML，但是它仍然只使用name, [Object, object]而不是name, <Icon name='star' />name2，它显示的是实际的星型，而不是组件的文本。
浏览 2提问于2017-05-31得票数 1
回答已采纳
我正在尝试编写一些Jquery代码来获取下一个文本框的值，该文本框属于"in“类。我这里的代码不工作，值总是未定义的。我想我错误地使用了next()函数，但我不确定，有人输入了吗？
<!DOCTYPE html>
<html>
<body>
<input type="text" class="mm" />
<br>
<input type="text" class="in" />
$(document).ready(function() {
浏览 0提问于2011-07-23得票数 0
回答已采纳
我有几个这样的HTML代码组合：
<h2></h2>
<p></p>
<iframe></iframe>
<hr/>
在此基础上，我想用jQuery创建一段代码：
<div id="sample">
<h2></h2>
<p></p>
<iframe></iframe>
</div>
<hr/>
我可以只执行以下功能：
$('h2').before('<div
浏览 0提问于2012-04-02得票数 3
回答已采纳
1回答
<div class="box">
<a>ABC</a>
<a>CBA</a>
</div>
a {
border: 2px solid red;
}
我有几个问题要问。
，，有人能给我指一下线盒在哪里吗？我被这个弄糊涂了
任何直接包含内联级内容的块容器(例如内联框、原子内联和文本运行)都会建立内联格式上下文来布局其内容。
因此，在我的示例中，这是否意味着在元素和其中的文本周围都绘制了一行框，或者只在a元素周围绘制，或者只在a element...where中的文本周围绘
浏览 2提问于2022-09-25得票数 -1
回答已采纳
2回答
我有这个html结构：
<a href="javascript:;" class="print">Open</a>
<pre class="CodeBlock">
<ol class="linenums">
<li class="L0"><span>one</span></li>
<li class="L1"><span>two</span></li>
&
浏览 2提问于2015-12-22得票数 1
回答已采纳
似乎不能让它工作。有什么想法吗？
我试图抓取出现在<h2></h2>之间的文本，同时将输入字段作为开始位置。
jQuery：
$(".title input").each(function(){
alert( $(this).prev('h2').text() );
}
Html：
<div class="tabbertab">
<h2>English (US)</h2>
<div class="title">
<
浏览 0提问于2011-04-05得票数 1
下面是HTML：
<div>
<label for="n-0">Label</label>
<input id="n-0" type="checkbox"/>
</div>
<!--More content-->
<p class="special"></p>
是否有一个CSS专用的选择器，可以在p.special时针对input:checked？还请注意，p.special是一个高于input的杠杆。
浏览 1提问于2017-11-14得票数 1
回答已采纳
我试图在容器中选择包含特定文本的容器，然后相应地隐藏它们。
但是，它似乎也选择了子元素，而不是主元素。
这会导致我的容器部分脱落。
$("#SearchText").on("keyup", function () {
var text = $("#SearchText").val();
$(".myList :contains(" + text + ")").show();
$(".myList :not(:contains(" + text + "))"
浏览 3提问于2015-08-12得票数 2
回答已采纳
1回答
我的HTML结构如下：
<h2>Title 1 <span class="open"> </span></h2>
<div class="licensesection" id="licensepage1">
//stuff
</div>
<h2>Title 2 <span class="open"> </span></h2>
<div class="lic
浏览 0提问于2013-07-03得票数 0
回答已采纳
1回答
如果我有两个HTML 5复选框像这样..。
<input name="your_name" value="your_value1" type="checkbox">
<input name="your_name2" value="your_value2" type="checkbox">
如何根据用户的输入显示文本区域(或任何其他HTML 5项)？例如，如果他们选择value1显示一个文本块，如果他们选择value2显示一个不同的文本块。这样做最好的方法是什么，而不必重新加
浏览 3提问于2015-12-24得票数 0
回答已采纳
4回答
我有一个<div>元素，它有一个背景图像。除此之外，我还有一些隐藏的文本，但是当用户悬停在<div>元素上时，文本将显示出来，<div>的不透明度也会降低。我的问题是，当您悬停在div中的所有元素改变透明度以及。我通过堆栈溢出查看是否有人有同样的问题，但我发现的只是RGBA使用背景色(而不是图像)的答案。
这是我的css：
.pic{
background-image:url(http://www.granitesportsinstitute.com/wp-content/uploads/2014/06/Green-Sea-Turtle-
浏览 0提问于2014-08-18得票数 0
回答已采纳
我正在试验的段落的字体大小和行高小于默认值，甚至可能小于1。试图理解它是如何工作的。
在代码片段中，您将看到两个段落:第一个段落行高正常，第二个段落行高0.8。我们可以看到，第二段确实短了，但它的顶层跨度(红色边框)比它所在的段落要高。更有趣的是，文本的每一行都保持高度不变。为了演示这一点，我只将第一个单词包装在另一个跨度(绿色边框)中。我们可以看到，内部跨度保持在完全相同的高度。外部跨度确实变短了，但这只是因为浏览器将顶部和底部的行叠放在一起。
另一个有趣的事实是，段落会环绕文本的基线，因此如果段落包含overflow: hidden style，则会截断下划线。
有人能解释这种行为吗？有没
浏览 0提问于2015-08-30得票数 1
我非常困惑附加函数是如何工作的。当我尝试使用append 3次后，它显示出与单个append函数非常不同的结果。
在javascript中(追加1次)
var divStep = $("#stepTab");
divStep.append('<div style="width:400px;height:40px;float:left;clear:left;"><input type="checkbox" />Test</div>');
在javascript中(附3次)
var divStep
浏览 7提问于2015-08-07得票数 1
回答已采纳
下面是我的HTML。我在<select>元素处，如何从页面上的下一个span元素获取文本？我尝试了几种方法，包括$( this ).nextAll( 'span:first' ).text();，其中$( this )是我的select元素，但是我没有得到想要的结果。
<ul id="questions">
<div>What do you want information about?</div>
<li>
<p>
<select>&l
浏览 0提问于2012-10-18得票数 1
回答已采纳
我想在submit按钮的值之后添加<i>Some Text</i>。如果我用HTML编写它，就像在代码片段中那样，它可以工作，但是如果我使用jQuery来附加它，它会部分工作。
我的部分意思是，如果打开Developer工具，就会出现附加的文本，但它不会显示在浏览器屏幕上。
这一切为什么要发生？
$(document).ready(function(){
$('.tryout').append('<i>Hello</i>');
});
<script src="https://aja
浏览 1提问于2015-09-14得票数 0
回答已采纳
我在一个页面中有不同的表单实例。我想用文本区域中的默认文本取消激活其中的提交按钮。我的实际代码是：
// This works
$(".proposal-write-comment-submit").each(function(){
var element = $(this).closest(".proposal-write-comment-textarea");
var default_text = element.attr("data-default");
var value_text = element.val
浏览 0提问于2011-09-26得票数 0
回答已采纳
3回答
<p class="current" style="display: block; ">MD</p>
<input type="text" class="hidden" value="MD" style="display: none; ">
<p class="small hidden" style="display: none; ">MD, MBBS etc.</p>
<a class="sa
浏览 0提问于2011-12-29得票数 0
回答已采纳
我试图遵循一个选择下拉列表的设计，其中：
填充:0 10 px0 10 Padding
但是，箭头根本没有被调整。它一直坚持在正确的一端。请参阅附呈的屏幕截图.
是否有方法瞄准特定的箭头并将垫子应用于其上？(目的是将相同的填充应用于双方的输入文本)
谢谢!
浏览 4提问于2020-12-03得票数 21
回答已采纳
1回答
我有一个问题的CSS下拉水平菜单。你能帮我做这个吗？
HTML：
<div id="menucontainer" align="center">
<div id="menubar" align="center">
<ul class="mainnav">
<li><a href="index.html">Home</a></li>
<li&
浏览 1提问于2014-01-28得票数 1
回答已采纳
我有以下html代码：
<div class="tests">
<input name="premise" id="premise" type="radio" class="required" value="0"><span>0</span>
<input name="premise" type="radio" class="required" value="1"&g
浏览 2提问于2012-04-13得票数 1
回答已采纳
1回答
我有两个包含一些内容的flex列。我希望第一列的高度始终等于第二列的高度，如果第二列的内容比其他列的内容更多，则使用overflow: auto。一个重要的注意事项是我不想使用绝对定位。以下是我所追求的：
.cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow-y: auto;
}
.content-1 {
height: 500px;
background-color: green;
}
.content-2 {
height: 150px;
浏览 2提问于2019-11-09得票数 1
回答已采纳
我有一个元素“文章”，它包含一个"div“，同时在不同的"z-index”中有4个"img“，从1到4，覆盖在剪辑效果中，所以我试图用html2canvas捕捉这个父元素”文章“。它捕获了最后一层z索引4中的最后一个img，但没有捕获另一个img，是css样式的问题，还是html2canvas的未实现函数？ 我该如何解决这个问题？ 这是一个django项目。 style.css article{
position:absolute;
left:200px;
top:0px;
width:841px;
height:752px;
浏览 65提问于2019-04-30得票数 0
2回答
我正在使用答案中的一个黑客来创建一个图像，以便在click上调整大小(复选框方法)。效果很好。但是，当我尝试在文本上应用css样式时，单击图像时，它将不起作用：
<html>
<body>
<input type="checkbox" id="img-box"/>
<label for = "img-box">
<img src="http://www.al-van.org/AV/Manners_files/greeneyedcat.jpg"/>
&l
浏览 1提问于2018-05-26得票数 1
回答已采纳
我需要更改复选框标签的样式。
这是我的html：
<div class="ui-checkbox">
<input id="keepMeInformed" type="checkbox" data-theme="d" onchange="fixCheckboxesValues();" checked="checked" value="1" name="optedIn">
<label class="optional u
浏览 3提问于2011-12-21得票数 2
回答已采纳
请看附呈的截图。是否有一种方法可以创建一个div来显示与CKEditor窗口中完全相同的HTML片段？在我的应用程序中，某些用户使用CKEditor输入文本，而其他用户则需要在视图模式下查看。一些简单的样式被保留下来(例如斜体，粗体)，但是其他重要的样式元素(例如高亮，表格边框)被丢失了。
浏览 0提问于2014-12-13得票数 0
回答已采纳
我读过 关于vertical-align的文章。我也见过，但是 说这是因为周围的文本默认为vertical-align: baseline;。然而，情况并非如此：
*
{
margin: 0;
padding: 0;
vertical-align: middle;
/* font-size: 1em; and line-height: 1em; do not change anything */
}
<span>0<span>0<span>0<span>0<span>0<span>0&l
浏览 3提问于2015-04-04得票数 3
回答已采纳
我已经创建了一些代码来选择按钮旁边的文本区域。使用相同的类名，页面上将出现多个这样的名称。
这是我的代码：
HTML:
<div class="iframe-con bannerone-con"> </div>
<div class="hidden-code">
<textarea class="copytxt"><?php echo file_get_contents(get_template_directory_uri().'/HTML-banner-sizes/970x250
浏览 2提问于2016-05-04得票数 0
1回答
我想让菜单左侧的文本不与菜单交互。每次我向其中添加文本时，它都会将我的菜单栏移到一边。你知道怎么修复它吗？我尝试了文本的固定位置，但它有but，在Mozilla Firefox中不起作用。
JsFiddle：
HTML：
<nav>
<span class="nadpis"> <a href="javascript:history.go(0)">BUR</a> </span>
<ul class="nav">
<li class="prve">&l
浏览 0提问于2016-08-10得票数 0
回答已采纳
我正在使用以下D3.js教程：。
我的问题如下：
我知道HTML中的位置在我是说，我通常把它放在这里：
<body>
<!-- HTML code -->
<script>
<!-- JS code or external JS link -->
</script>
</body>
通过这个实践，我想要的是在HTML内容呈现之后运行JS。
但!当我使用D3.js遵循这一实践时，我发现D3.js在脚本标记之后呈现我添加的内容(使用d3(“html”).append(需要追加的东西)。
例如!
浏览 3提问于2022-03-23得票数 1
回答已采纳
从javascript函数的成功行动，我是注入内容到div使用它的id。
$.ajax({
url: formatUrl('/MyController/MyActionMethod'),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({ id: target }),
success: function (result) {
浏览 2提问于2014-04-20得票数 0
回答已采纳
我有以下xml文档(我清除了不相关的数据)：
<?xml version="1.0"?>
<NewOrderNotification xmlns="http://payments.amazon.com/checkout/2008-11-30/">
<ProcessedOrder>
<ShippingServiceLevel>blah</ShippingServiceLevel>
<ProcessedOrderItems>
<ProcessedOrderI
浏览 2提问于2012-11-05得票数 0
回答已采纳
考虑一下这个HTML：
<html>
<head>
</head>
<body>
<table>
<tr>
<td>
<h1>title</h1>
<h3>item 1</h3>
text details for item 1
<h3>item 2</h3>
text details for item 2
浏览 1提问于2010-11-03得票数 3
回答已采纳
我有下面的进行测试。要选择所有<a>文本，我可以这样做：
descendant::div[attribute::id="nav_tutorials"]/descendant::a/text()
要选择所有a节点，我可以这样做：
descendant::div[attribute::id="nav_tutorials"]/descendant::a/node()
为了获得我能做的所有a链接：
descendant::div[attribute::id="nav_tutorials"]/descendant::a/attribute::h
浏览 3提问于2020-12-01得票数 1
回答已采纳
4回答
我读了很多关于CSS继承的文章，但是我没有找到关于这个问题的任何东西，我很困惑。请考虑以下几点：
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
.anc {
background-color: blue;
color: red;
}
.des {
background-color: inherit;
color: inherit;
}
</style>
</head>
<body>
<div class=
浏览 3提问于2013-09-18得票数 3
回答已采纳
1回答
获取最近父标记的内部文本
、、、、
我使用Ruby & Nokogiri解析页面上的html。
<div><a href="#" title="firstTitle">text one</a></div>
<p class="OK">some content</p>
<p class="OK">some content</p>
<div><a href="#" title="secondTitle"&g
浏览 3提问于2015-08-14得票数 1
回答已采纳
我正在尝试(在原生Javascript中，所以没有jQuery或任何东西)在出现div之前和之后获取内容。
HTML：
<div id="thisIsWhatIWant">
<span>foo</span>
<div id="helloWorld">hello world</div>
<p>bar</p>
</div>
所以我想把<span>foo</span>和<p>bar</p>放在单独的vars中。
浏览 1提问于2015-02-23得票数 0
回答已采纳
我没有找到任何人解释这个错误..。
我使用的是lxml 3.1.0。
当有这样的HTML/XML时：
<h1 class="fn"><strong class="brand">Lange</strong> XT 100 LV Ski Boots 2014</h1>
当我们运行时，字符串“XT 100 LV Ski Boot 2014”的_ElementStringResult将被返回：
>> elemstr = tree.xpath('//body//h1/text()')[0]
然而，
浏览 2提问于2014-07-04得票数 0
回答已采纳
2回答
我希望将html附加到D3中的一个矩形上，给我一个多行工具提示。下面的部分是我如何添加一个矩形，这可能是问题的一部分。上面的代码应该在我的世界里起作用。
newRect.().html(" <textArea font-family=Verdana font-size=20 fill=blue > Test " + "</br>" + "Test2 </textArea>");
它确实在SVG中插入了一个文本字段，它只是不显示：
<rect id="rectLabel" x="
浏览 6提问于2013-12-17得票数 81
回答已采纳
4回答
我有一组放在DIV中的超链接(使用a标记)，我希望它们在DIV中居中。我已经尝试过将文本对齐(斜体)放在这个DIV上，也尝试过对于超链接使用“页边距0自动”(斜体)，但是它们仍然牢牢地粘在左边。
下面是HTML和CSS代码。
谢谢你的帮助！
<div id="navigation">
<a class="nav" href="index.html">Home</a>
<a class="nav" href="Page 1.html">
浏览 5提问于2014-02-16得票数 3
假设我有这样的HTML：
<textarea>blah</textarea>
<br>
<div class="select_this">hello!</div>
当我已经识别了文本区域时，如何选择类为"select_this“的DIV？我不想在整个文档上使用类选择器，因为我正在处理一个大文档，并且在较旧的浏览器中查找类的速度很慢。
closest .next()似乎不能完成这个任务，jQuery ()只查找DOM树，而.nextUntil()可以处理除"select_this“div之外的所有内
浏览 0提问于2012-05-23得票数 12
回答已采纳
<div class="input-container">
<label>Input Label</label>
<input />
</div>
这是html，当输入焦点处于活动状态时，我希望重新调整标签测试的大小和位置。
我的css看起来像这样
.input-container > input:focus .input-container > label {
color: green;
}
对于此示例，是否有一种方法可以在输入聚焦时将标签文本颜色更改为绿色？谢谢，我知道JS很容易
浏览 8提问于2022-09-07得票数 0
回答已采纳
在XPath/XSLT2.0中，无论非文本节点是否介入，如何测试文本节点是否在当前节点和前面的同级<lb/>之间进行干预？
XML：
<lb/>I'd like to test whether this text exists.<someNode/><currentNode/>
额外的问题:如果<lb/>可能是当前节点的同级或父节点的同级，那么需要的语法是什么？
浏览 4提问于2017-06-02得票数 1
回答已采纳
1回答
<tr class="even">
<td>101</td>
<td>NotProvisioned</td>
<td>1</td>
<td>
<a href="procdef.jsf?id=101">Examine</a>
</td>
嗨，伙计们，我的桌子上有几行。使用xpath，我需要在行中选择元素，其中一个td单元格具有文本值NotProvisioned，而它的兄弟姐妹之一有一个
在萤火虫中，我尝试了以下方法，
$x
浏览 1提问于2015-04-27得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
