如何从子元素(按钮元素)中选择一个嵌套在div中的远端父元素？
要从子元素中选择一个嵌套在div中的远端父元素，可以使用JavaScript来实现。以下是一种可能的解决方案：
- 首先，获取所有的按钮元素，可以使用document.querySelectorAll()方法，并传入按钮元素的选择器，例如"button"。
- 遍历所有的按钮元素，对于每个按钮元素，可以使用parentNode属性来获取其父元素。
- 检查父元素是否为div元素，可以使用tagName属性来获取元素的标签名，并与"DIV"进行比较。
- 如果父元素是div元素，则找到了嵌套在div中的远端父元素。
以下是一个示例代码：
// 获取所有的按钮元素
var buttons = document.querySelectorAll("button");
// 遍历按钮元素
for (var i = 0; i < buttons.length; i++) {
var button = buttons[i];
// 获取父元素
var parentElement = button.parentNode;
// 检查父元素是否为div元素
if (parentElement.tagName === "DIV") {
// 找到了嵌套在div中的远端父元素
console.log("找到了嵌套在div中的远端父元素:", parentElement);
break;
}
}这是一个基本的解决方案，可以根据实际情况进行调整和优化。在实际开发中，可以根据具体需求使用不同的方法和技术来选择嵌套在div中的远端父元素。
相关·内容
我正在一个元素上使用下面的点击函数：
$('#extras').toggle(function() {
$('div#extras').show();
$('div#extras').stop().fadeTo('fast', 1);
},
function() {
$('div#extras').stop().fadeTo(&#
浏览 0提问于2010-08-17得票数 0
回答已采纳
1回答
编辑
目标是在按钮悬停时显示一个向上的过渡高度，但这一行CSS .btn-position:hover ~ .bg-transit { height: 430px !important;}似乎向下扩展，而不是向上扩展。有没有办法向上过渡？
我不想给它添加任何JS。
HTML
<div class="career-wrapper-positions">
<div class="section-positions">
<div class="position-wrap">
<
浏览 0提问于2018-11-13得票数 0
给出下面的片段，我如何使用parent类来设计孙辈元素的样式？
<body>
<div class='parent'>
<ul>
<li>grandchild</li>
</ul>
</div>
</body>
浏览 10提问于2022-04-21得票数 0
1回答
我想向组件传递一个插槽中的按钮，它将有一个动作。例如一个具有“添加行”功能的表。
<my-table :data="data" :cols="cols">
<button slot="add_row"></button>
</my-table>
或者，此反汇编警报：
<alert>
<button slot="close">Remove the alert</button>
</alert>
它们具有以下模板：
<d
浏览 47提问于2018-06-11得票数 3
除了三个允许更改菜单按钮上的标签语言和文本元素的内容(下面的变量contentText )之外，我还提供了一个包含“关于”、“新闻”和“联系人”的菜单。
我使用Vue.js和自定义组件，以及来存储语言状态。我可以选择菜单按钮上标签的语言。例如，如果我单击标记为fr的按钮，则菜单条上的标签将从“消息”更改为“消息”、“新闻到新生事物”等，但由于某些原因，当我单击任何一个菜单按钮时，不会触发相应的文本元素的可见性。处理状态的代码大致如下(Jsfiddle )：
Vue.use(Vuex)
var storelang = new Vuex.Store({
state: {
lang: {
浏览 2提问于2016-03-01得票数 1
回答已采纳
我正在通过CDN加载基本语义-ui.min.css，即：
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css"></link>
但是，我的页面还有其他div：
<div id="wrapper">
<div id="menu-in-react"></div>
<div id="container-for-non
浏览 1提问于2017-01-31得票数 0
回答已采纳
我在用react做一个按钮发生器。
因此，当用户单击get代码时，它将得到outerHTML of 绿色按钮(Whatsapp按钮)。但在反应中，我所知道的元素是使用ref。问题是绿色按钮不同组件与获取代码按钮。
这是我的密码。
import React from 'react';
import ButtonCanvas from '../containers/buttonCanvas';
import ButtonGroup from './buttonGroup';
import SectionHeading from '../
浏览 2提问于2018-02-14得票数 1
回答已采纳
1回答
如何从网页中获取子类
、、、
我正在使用jsoup从像这样的网页中查找类
Document doc = null;
try {
doc = Jsoup.connect(strings[0]).get();
// Get document (HTML page) title
String title = doc.title();
// Get meta info
Elements metaElems = doc.select("div");
浏览 0提问于2017-10-26得票数 1
回答已采纳
我有一个很小的html代码：
<div class="main">
<div class="comments">
<div class="insider">
<div class="text">
some text
</div>
</div>
</div>
</div>
我目前在const ele = document.querySelector(".text
浏览 5提问于2020-07-17得票数 2
回答已采纳
2回答
您好，我正试图在单击按钮时更改状态，并且仅当状态更改时运行createBattle()，但在单击按钮后状态不会更改。
在开始时，我将状态设置为false。该按钮位于事件onClick=为{this.handleClick}的Form.js中。然后，事件handleClick应该将状态设置为true，并且当状态发生变化时，Battle.js中的createBattle()应该呈现该表。
请告诉我我做错了什么？
谢谢
App.js
import React from "react";
import Titles from "./Components/Title";
浏览 0提问于2018-10-24得票数 0
1回答
我目前正试图让这两个主图片和伴随的选择器，但最终会有多个变体。
我的图像交换脚本工作并悬停在缩略图上，将主图像源更改为缩略图的主图像源，但是它改变了这两个缩略图的主图像，而不是仅将缩略图分组。
脚本当前更改了这两种情况：
$(document).ready(function() {
// Image swap on hover
$("div.product li img").hover(function() {
$('img.productimg').attr('src', $(this).attr('src').
浏览 0提问于2019-01-24得票数 0
回答已采纳
我在组件中有一个数组，我想导出它或将它传递给其他组件(父组件)。
儿童部分：
export default function child(){
const arr = ["1020","52214","3325"]
return (
<div> child</div>
)
}
家长：
export default function parent(){
return (
<>
<div> parrent</div>
<child/>
</>
)
}
浏览 2提问于2022-09-21得票数 1
回答已采纳
我试图使用selenium中的xpath单击下面的按钮，
<div class="bg-iconButton-button bg-common-nodrag bg-tool-maximize bg-common-hideDisplay" title="Display in full screen" id="bg-po-full-screen-1"></div>
我试过下面的代码，
fullscreenbutton=UtilityFunc.driver.findElement(By.xpath("//*[@id=&#
浏览 3提问于2020-05-15得票数 0
2回答
我正在练习使用悬停的css，当我注意到这个问题时，当我悬停在顶部时，颜色会变成蓝色，中间会变成红色，但当我悬停到中间时，中间会变成红色，但顶部仍然是红色。
我试着在中间添加一个！重要的:悬停，但它不起作用。我还删除了+号，但我认为它不会起作用，因为它应该在同一个div上才能起作用。
为什么当中间div被悬停时，顶部div的悬停不起作用？
HTML
<div class="top">
<p> HELLO WORLD </p>
</div>
<div class="middle">
<
浏览 0提问于2014-11-18得票数 4
好吧，我试着把CSS的级联和特异性理解为一门“科学”，并不总是把它留给“命中或失败”的方法。我希望有人能帮帮我。
我有一个规则：
.bluebutton {margin: 0 10px 6px 0;} /* rule 1 */
我需要重写以更改特定实例中的页边距。
所以我在div中添加了一个class，并写道：
.aside-right .bluebutton a {margin:30px 0 0 100px;} /* rule 2 */
但是，规则%2没有覆盖规则% 1。
因此，我将规则2修改为：
.aside-right a.bluebutton {margin:30px 0 0 100p
浏览 3提问于2012-08-26得票数 1
回答已采纳
考虑以下小提琴：
如何才能从父div (类outer)而不是从子类中获取激发的事件？
浏览 4提问于2013-05-12得票数 0
1回答
我肯定这是个很简单的问题，但我找不到答案。我使用非常常见的模式来创建树。我需要知道用户是单击父节点还是子节点。如果单击父节点，一切都会正常工作。但是，如果单击子节点，回调函数会调用两次--首先从子节点调用，第二次从父节点调用。谁能解释一下为什么吗？谢谢。
<div id="groups-tree" class="col-sm-4">
<script type="text/ng-template" id="nodes_renderer.html">
<div ui-tree-ha
浏览 2提问于2017-05-18得票数 0
回答已采纳
假设我有以下HTML代码(这是一个示例)：
<div id="site_header_container" class="site_bar_container">
<div id="site_header">
<div id="header_logo_container">
<a class="sliced" id="header_logo" href="/">&
浏览 4提问于2013-11-20得票数 2
回答已采纳
我需要将收音机按钮设置为通过url传递的值。
function filterCategory(ads) {
let categories = Array.from(new Set(ads.map(ann => ann.category)));
let rowCategoryRadio = document.querySelector('#row-category-radio');
categories.forEach((cat, i) => {
let input = document.createElement('div
浏览 1提问于2022-06-06得票数 1
回答已采纳
如果只使用CSS，如果子元素没有类，是否可以隐藏父元素？
<!-- hide this -->
<div class="parent">
<p class="badChild" />
</div>
<!-- do not hide this -->
<div class="parent">
<p class="goodChild" />
</div>
不幸的是，我不能更改页面的标记。我只能添加CSS规则。
浏览 5提问于2016-04-06得票数 3
回答已采纳
1回答
我有一些列表元素，如下所示：
<li class="item">
<a class="toggle"><h4>ämne<small>2010-04-17 kl 12:54 by <u>nike1</u></small></h4></a>
<div class="meddel">
<span>
<img style="max-width: 70%;
浏览 0提问于2010-04-18得票数 4
回答已采纳
1回答
我在推特(和Facebook一样)按钮上做了一个div。我希望当我悬停在div (按钮)上方时，它就会向上移动，这样你就可以实际按下真正的推特按钮了。我试过以下几种方法。
HTML：
<div class="tweet-bttn">Tweet</div>
<div class="tweet-widget">
<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a
浏览 4提问于2013-09-17得票数 4
回答已采纳
我有两个元素。第一个称为测试布局的方法是使用来自core-layout的样式。
在测试布局中：
<link rel="import" href="../commons/core-layout.html">
<style include="core-layout"></style>
<div class="containerTest">Test Layout Text</div>
在核心布局中：
<style>
.containerTest{
colo
浏览 2提问于2016-09-22得票数 0
回答已采纳
1回答
CSS过渡提前切断
、、、
我有一个问题，我的CSS转换被切断早期，我不知道为什么会发生。我认为这与子元素上的另一个转换有关，因为如果删除使子元素转换的代码，容器的转换就可以了。
代码有点长，我正在使用一个名为的库，它应该允许我在元素之间进行转换，就像它们是卡片一样。
这是相关HTML的结构：
<ul id="cards" class="baraja-container">
<li id="usa-germany" class="card">
<div id="room-info">
浏览 1提问于2014-06-26得票数 3
回答已采纳
4回答
只是想知道从内存的角度来看，这是如何管理的。
假设我有一个HTML页面。
<div id="container">
<div id="someID"></div>
<div>
和以下jQuery代码：
$("#someID").click(function(){
//do something
});
现在，在我的脚本中，我需要清空(清除) #container中的所有内容
$("#container").empty();
这是自动删除/解除绑定click事件，还是我必
浏览 2提问于2012-07-31得票数 2
回答已采纳
1回答
我很难弄清楚如何访问子作用域数据。在创建项目时，我使用路由和ui视图来创建流，我有“向导”，它是父状态，还有几个子状态，每个子状态都有不同的控制器。
这是我的"Wizard.html“文件，带有子状态的ui-view。
<div class="header">
<button ng-click="someFunction()">Back</button>
<button ng-click="createProject()">Next</button>
</d
浏览 2提问于2015-12-22得票数 1
我有一个“浮动”的固定位置div，点击一下标签就会显示出来。在固定div中有一个表单按钮。
现在，因为div可以显示在页面上的任何位置，并且当用户在它下面滚动页面时，我给它的不透明度是0.8。但是，我仍然希望div中的按钮处于完全不透明度(1)，但它不重置按钮不透明度。
这是css
#delHolder {
width:280px;
text-align:center;
position:fixed;
background:#fff;
opacity:0.8;
height:60px;
top:150px;
left:50%;
margin-left:-140px;
z-i
浏览 3提问于2013-01-21得票数 0
回答已采纳
在此代码中，这两个框将同时出现(水平)。
<style>
#box{
display: flex;
height: 500px;
}
#box-1 {
background-color: blue;
width: 50%;
height: 50%;
}
#box-2 {
background-color: red;
width: 50%;
height: 50%;
}
</style>
<div id="box">
<div id="box
浏览 0提问于2019-04-24得票数 0
回答已采纳
在fetch调用的返回值上显示了一个简单的列表。我有一些关于选择项目的功能，但是对于我的生活，我不能启动onClick事件。我在地图之外绑定了一些事件，这些事件可以正常工作( onKeyUp和down)，但是在地图中的onClick却不能工作。不知道从那里往哪里走。
handleClick() {
// won't fire
console.log('test')
}
render() {
return (
<div className="autocomplete">
浏览 4提问于2017-05-28得票数 0
回答已采纳
1回答
我在摆弄CSS动画，因为它们太棒了。
我正在试着在页面的左手边做一个导航栏。我希望条形图占据页面高度的100%，但是当我为高度设置该属性时，我的条形图不再出现在页面上。CSS动画不能使用基于%的高度和宽度吗？
我的CSS：
body{
overflow: hidden;
padding: 0;
overflow-x: hidden
}
div {
-webkit-animation:myfirst 4s; /* Safari and Chrome */
-webkit-animation-fill-mode: forwards;
font-size: .2px;
pad
浏览 2提问于2013-11-08得票数 0
1回答
我使用li创建了下面的下拉列表，并在下拉列表中提供了删除功能。如果单击“X”，则必须删除记录。然而，当我点击'X‘时，它也会触发'changeFilter’，这也是在同一个li中。有什么办法可以防止“changeFilter”触发器吗？
下面是密码-
<ul>
<li v-on:click="createNew">Create new Filter</li>
<li v-for="item in filters.entities" v-on:click
浏览 2提问于2022-07-18得票数 0
回答已采纳
我对Backbone和JS完全陌生，所以如果这是一个愚蠢的问题，请原谅我。
下面是我的HTML代码：
<div id="sectionOne">
<h3 class="listHeader"></h3>
<ul></ul>
</div>
<div id="sectionTwo">
<h3 class="listHeader"></h3>
浏览 0提问于2013-07-03得票数 0
回答已采纳
我在我的应用程序中广泛使用jQuery UI (1.8.16)。
我已经开发了一个简单的函数，它使用ajax调用获取一些json数据，并使用jQuery UI按钮集在分页程序中转换DIV：
<div id="answersPager"></div>
这是javascript：
BuildAnswersPager: function(selectedPage, totalPages) {
$("#answersPager").empty();
if (totalPages > 1) {
var ctl = []
浏览 0提问于2011-08-22得票数 1
回答已采纳
我对WPF还不熟悉，所以这可能是个新手问题。我正在做一些图表编辑器，想把一些元素和线条连接起来。这些元素中的一些将嵌套在其他元素中，并且单行可能会在不同级别上传递元素。因此，我想要做的是在顶部父元素中的OnRender事件中绘制这些线条。下面是一个初步的尝试，在这里，我使用的不是一行，而是按钮周围的正方形，只是为了确保我能够正确定位子元素：
public class Container : Border
{
public readonly StackPanel Panel = new StackPanel();
private readonly Pen _Pen = new P
浏览 1提问于2015-02-11得票数 2
回答已采纳
此元素的目的是拥有一个完全基于简单无序列表的可折叠导航系统。默认情况下，将隐藏所有嵌套列表，并将.toggle div(按钮)附加到包含嵌套列表的li项。然后，这些.toggle div应该隐藏/显示嵌套列表，并将一个类应用于切换按钮。
我已经通过手动插入.toggle div (位置用切换div标记)来测试这段代码，一切都运行得很好。但是，当通过append()添加它时，似乎什么都不起作用。有没有人知道可能导致这个问题的原因？任何帮助都将不胜感激--谢谢！
HTML：
<div id="nav">
<ul>
<li><a href=&
浏览 1提问于2011-05-27得票数 1
回答已采纳
2回答
我在用VueJS。我有两个组成部分。第一个是第二个的父母。父对象有一个保存对象的数组，而我们通过侦听子对象来获得对象。
儿童
<template>
<div>
Create a new item <button @click="createItem">Create Item</button>
</div>
</template>
<script>
export default {
data () {
return {
item: {
id
浏览 6提问于2020-04-24得票数 0
回答已采纳
1回答
我目前正在构建一个在标签中包含复选框的表单。我们之所以这样做，是因为我们需要将原来的复选框替换为图像。但是，当复选框被选中时，我们需要使标签有一个边框，以便向用户提供一些反馈。
下面是标签/复选框的设置
<div class="one_column">
<label for="fieldname2_1_cb0">
<input name="fieldname2_1[]" id="fieldname2_1_cb0" class="field depItem group re
浏览 8提问于2020-02-26得票数 1
回答已采纳
4回答
我有JS生成的内容，并希望围绕它的div。
我不知道为什么，但是div的父级总是100%宽。
我以为我在某个地方有div width: 100%，但令人惊讶的是它在jsfiddle中看起来几乎一样：
那么为什么外部div总是100%宽呢？如何解决这个问题呢？我尝试使用display: inline，但它将宽度设置为0px ;/
CSS：
.outer {
border: solid 1px red;
}
.item {
height: 300px;
width: 400px;
border: solid 1px blue;
}
.allright {
浏览 15提问于2011-03-10得票数 5
回答已采纳
1回答
我正在编写一个页面，需要刷新父窗口的某些div，下面是我的用例。
用户点击“添加到购物车”按钮，弹出就会有附加的产品细节。
我正在调用在JS文件中定义的java-script方法，该方法包含在父窗口中。
从该函数中，我调用一个ajax调用，并希望使用ajax调用替换从服务器发送的内容中的div内容，下面是方法
function updateAllotmentQtySection(){
if($('#isProductAllotment').length > 0){
var allotmentEntryCode=$("#allotmentEnt
浏览 2提问于2012-10-05得票数 0
回答已采纳
我已经看了一段时间了，但不知怎么的，我遗漏了一些东西。我有一个在firefox和chrome中看上去不错的站点，但是在IE中，第一个div会“拆分”到右边。似乎IE在div中接受了第一个块元素，并将其放置在下一列中。带有错误的页面：：在IE中，您可以看到它向右跳。希望有人能回答这个问题。我希望不是简单的事情..。
被拆分的html是：
<div class="blockcontent">
a <a href="">b</a>
</div>
所以甲向左，乙向右？
更新：--我删除了style.css的全部内容(所以没
浏览 0提问于2010-08-08得票数 2
2回答
可能重复：
那么，这里有什么区别？
div a {
/* Styles here */
}
和
div > a {
/* Styles here */
}
我真的不明白。
浏览 3提问于2012-09-16得票数 1
回答已采纳
2回答
如果我在带有overflow-x: auto的div中有一个带有position: absolute的按钮，该按钮将捕捉到容器的边缘。 但是，如果div的内容超出水平宽度，则滚动后按钮将固定在容器中的起始位置。 ? 看起来absolute应该把它放在一边，但似乎没有做到这一点 有没有办法将子内容固定在可水平滚动的div的右侧？ 最小、完整、可验证的示例 .container {
width: 20rem;
border: 1px solid grey;
padding: 1rem 1rem;
position: relative;
over
浏览 36提问于2019-09-17得票数 0
回答已采纳
我想把事件道具从一个子项目传递给父级，所以当我们单击“子组件”中的“子组件”按钮时，应该触发“父级状态”。
让我们假设我们有两个组件，Parent和Child，但是Child不会直接导入Parent，如下所示
export default function Parent() {
const [count, setCount] = useState(0);
const handleClick = num => {
setCount(current => current + num);
};
return (
<div>
&l
浏览 4提问于2022-10-28得票数 0
回答已采纳
假设以下情况：
<div class="a"> <!-- select -->
<div class="b">
<div class="a"> <!-- skip -->
</div>
</div>
</div>
<div class="b">
<div class="a"> <!-- select -->
<div class="
浏览 0提问于2013-07-17得票数 2
回答已采纳
我目前正在使用React创建一个伤害计算器应用程序。我才刚刚开始，所以请耐心点。
下面是我获取'Atk‘输入值的代码。它目前在我的组件‘CalculatorItems’中：
class Atk extends Component {
constructor(props) {
super(props);
this.state = {stats: ''}
}
render() {
return (
<div>
<label>PHY/MAG ATK</label><
浏览 0提问于2018-09-20得票数 0
我正在尝试对导航进行排序，除了child.innerHTML ==排序类型之外，每个父A都应该是隐藏/不可见的
我怎样才能做到这一点呢？
function sort_sidebar(type) {
if(type && type.substring(0,6) == "#sort=") {
$('#id > div > a').hide()
// $('#id > div > a > p:last-child > span:last-child').show() w
浏览 1提问于2016-06-16得票数 1
1回答
如何组合两个组件Vue.js
、、、、
我有一个组件，它是一个按钮，一个用于html。我需要从具有v-if条件的html组件中的按钮获得响应。如果按钮单击true，则追加html。
<template>
<button v-on:click="greet">Greet</button>
</template>
<script>
export default {
data () {
return {
toggle:
浏览 0提问于2018-09-04得票数 1
回答已采纳
我是react js的新手。这可能是一个简单的问题，但我没有办法做到这一点。所以，我想问这个问题。
我有一个grandParentComp，就像
GrandParent
import React from 'react';
class QuizSetupMain extends React.Component {
constructor(props) {
super(props);
this.state = {
technologies: this.props.technologies,
浏览 0提问于2018-10-02得票数 0
2回答
当单击以showExtraBlogposts呈现的按钮时，我想在Blogpostreader.js中调用函数Blog.js ()
我尝试用onClick={Blogpostreader.showExtraBlogposts()}调用它，它返回showExtraBlogposts()不是Blogpostreader的函数.
import React from 'react';
import axios from 'axios';
import Blogpost from './Blogpost.js';
class BlogpostReader
浏览 3提问于2019-05-13得票数 0
我有一个带有按钮的div，我想为这两个按钮创建单独的单击事件，但是当单击按钮时，它将触发按钮事件和容器事件。有人能帮帮我吗。我不使用jQuery。
var button = document.querySelector('button');
button.addEventListener('click', function(){
alert('button clicked');
})
var container = document.querySelector('.container');
container.addEve
浏览 0提问于2018-04-13得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
