blocks|key|1656751|text|给你div一些id，然后改变它：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1656752|<div+id="test"></div>

document.getElementById("test").style["display"]+=+"block";
or
document.getElementById("test").style.display+=+"block";
or+
document.getElementById("test").style.setProperty('display',+'block');
or
document.getElementById("test").setAttribute('display',+'block');|code-block|syntax|javascript|1656753|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Give to you div some id and then just change that:</p>

<pre><code>&lt;div id="test"&gt;&lt;/div&gt;

document.getElementById("test").style["display"] = "block";
or
document.getElementById("test").style.display = "block";
or 
document.getElementById("test").style.setProperty('display', 'block');
or
document.getElementById("test").setAttribute('display', 'block');
</code></pre>


blocks|key|3192033|text|这可能不是你直接想要的，但无论如何它可能会有所帮助。要使它在您的情况下工作，只需将按钮按下更改为对所选值的检查。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3192034|此路由不是直接调整CSS，而是修改元素的classList以移除或添加包含正确CSS的.hidden类。|offset|length|style|CODE|3192035|​|3192036|//+Loop+through+all+modal+buttons
document.querySelectorAll('.modal-button').forEach(function(element)+{
++//+Add+a+click+event+listener+to+all+modal+buttons+
++element.addEventListener('click',+function()+{
++++//+Toggle+the+target+modal+on+click
++++toggleModal(element.dataset.target);
++});
});

//+Create+the+function+to+toggle+the+modals
function+toggleModal(target)+{
++//+Find+the+target
++let+targetElement+=+document.querySelector(target);
++
++//+Check+if+the+target+is+hidden
++if+(targetElement.classList.contains('hidden'))+{
++++//+If+it+is,+show+it
++++targetElement.classList.remove('hidden');
++}+else+{
++++//+If+it+isn't,+hide+it
++++targetElement.classList.add('hidden');
++}
}|code-block|syntax|javascript|3192037|.hidden+{
++display:+none;
}|3192038|<button+data-target="#modal"+class="modal-button">Toggle+Modal</button>
<div+id="modal"+class="hidden">Hey+there,+I'm+a+modal!</div>|3192039|3192040|entityMap^0|0|K|9|17|7|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|W|8|@$D|X|E|Y|F|G]|$D|Z|E|10|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|11|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|12|8|@]|9|@]|A|$M|N]]|$1|O|3|P|5|L|7|13|8|@]|9|@]|A|$M|N]]|$1|Q|3|R|5|L|7|14|8|@]|9|@]|A|$M|N]]|$1|S|3|I|5|6|7|15|8|@]|9|@]|A|$]]|$1|T|3|-4|5|6|7|16|8|@]|9|@]|A|$]]]|U|$]]

<p>This may not be directly what you're looking for, but it may help anyways. To make it work in your case, just change the button press to be a check for the selected value.</p>

<p>Rather than adjusting the CSS directly, this route modifies the element's <code>classList</code> to remove or add a <code>.hidden</code> class that contains the correct CSS.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>// Loop through all modal buttons
document.querySelectorAll('.modal-button').forEach(function(element) {
  // Add a click event listener to all modal buttons 
  element.addEventListener('click', function() {
    // Toggle the target modal on click
    toggleModal(element.dataset.target);
  });
});

// Create the function to toggle the modals
function toggleModal(target) {
  // Find the target
  let targetElement = document.querySelector(target);
  
  // Check if the target is hidden
  if (targetElement.classList.contains('hidden')) {
    // If it is, show it
    targetElement.classList.remove('hidden');
  } else {
    // If it isn't, hide it
    targetElement.classList.add('hidden');
  }
}</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>.hidden {
  display: none;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;button data-target="#modal" class="modal-button"&gt;Toggle Modal&lt;/button&gt;
&lt;div id="modal" class="hidden"&gt;Hey there, I'm a modal!&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1791680|text|我不能从你的问题中确定拼图的各个部分是如何相互关联的，如果你能通过展示更多的HTML和Javascript代码来澄清，这将是有帮助的，但同时我会向你抛出几个想法。如果我告诉你一些你已经知道的事情，很抱歉。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1791681|您通常能够设置"style.display“的唯一一种对象是HTML元素。要告诉Javascript您想要修改哪个HTML元素，通常使用"document.getElementById('myDiv')“这样的CSS选择器。|1791682|听起来“曼哈顿”可能是一条信息，您可以使用它来唯一地标识您想要显示的HTML元素。如果是这样的话，有四个简单的部分来显示正确的元素：|1791683|1791684|将元素与特定字符串关联(如通过id)|unordered-list-item|1791685|在运行时获取字符串(与您处理警报的方式相同)|1791686|根据匹配的字符串选择元素|1791687|显示选定的元素|1791688|<代码>F29|1791689|总而言之，它可能看起来像这样：|1791690|<div+id="manhattan"></div>
<script>
var+identifier+=+intersects[0].object.title;
alert(identifier)+//I'm+assuming+this+alerts+"manhattan"
var+elementToShow+=+document.getElementById(identifier);
elementToShow.style.display+=+"block";
</script>|code-block|syntax|javascript|1791691|这是在正确的轨道上吗？如果没有，请提供更多细节，我会看看我还能提出什么建议。|1791692|entityMap^0|0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|13|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|14|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|15|8|@]|9|@]|A|$]]|$1|G|3|H|5|I|7|16|8|@]|9|@]|A|$]]|$1|J|3|K|5|I|7|17|8|@]|9|@]|A|$]]|$1|L|3|M|5|I|7|18|8|@]|9|@]|A|$]]|$1|N|3|O|5|I|7|19|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1A|8|@]|9|@]|A|$]]|$1|R|3|S|5|6|7|1B|8|@]|9|@]|A|$]]|$1|T|3|U|5|V|7|1C|8|@]|9|@]|A|$W|X]]|$1|Y|3|Z|5|6|7|1D|8|@]|9|@]|A|$]]|$1|10|3|-4|5|6|7|1E|8|@]|9|@]|A|$]]]|11|$]]

<p>I'm not certain from your question how the pieces of your puzzle are related to one another, and it would be helpful if you could clarify by showing more of your HTML and Javascript code, but I'll toss a couple of ideas at you in the meantime. Apologies if I'm telling you stuff you already know.</p>

<p>The only sort of object you would usually be able to set "style.display" on is an HTML element. To tell Javascript which HTML element you want to modify, you usually use a CSS selector like "document.getElementById('myDiv')"</p>

<p>It sounds like "manhattan" might be a piece of information you could use to uniquely identify the HTML element you intend to show. If so, there are four simple parts to showing the correct element:</p>

<ul>
<li>associate the element with that particular string (eg via an id)</li>
<li>get the string at runtime (the same way as you did for the alert)</li>
<li>select the element based on the matching string</li>
<li>display the selected element</li>
</ul>

<p>All together, it might look like this:</p>

<pre><code>&lt;div id="manhattan"&gt;&lt;/div&gt;
&lt;script&gt;
var identifier = intersects[0].object.title;
alert(identifier) //I'm assuming this alerts "manhattan"
var elementToShow = document.getElementById(identifier);
elementToShow.style.display = "block";
&lt;/script&gt;
</code></pre>

<p>Is this on the right track? If not, just provide more detail, and I'll see what else I can suggest.</p>


<p>I'm struggling to get this working because I don't know the right formatting.</p>

<p>What I am attempting is to get a CSS modal to display depending on what a user selects as a value in a Javascript applet.</p>

<p>The idea is to return .style.display = "block"; </p>

<pre><code>function onClick(event){
    &lt;something&gt;.style.display = "block"; 
}
</code></pre>

<p>Where  contains a value that has being saved in the format of intersects[0].object.title</p>

<p>So if for example I have selected "manhattan"</p>

<pre><code>alert(intersects[0].object.title)
</code></pre>

<p>I'll get the string "manhattan" displaying correctly. That works perfectly.</p>

<p>But I can't get manhattan.style.display = "block"; returned and WORKING inside the function? I tried :</p>

<pre><code>function onClick(event){
    intersects[0].object.title.style.display = "block"; 
}
</code></pre>

<p>Also tried</p>

<pre><code>function onClick(event){
    (intersects[0].object.title).style.display = "block"; 
}
</code></pre>

<p>Any help would be greatly appreciated</p>


Calling a value + style.display function?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我正在努力让它工作，因为我不知道正确的格式。我尝试的是让CSS模式根据用户在Javascript applet中选择的值来显示。其想法是返回.style.display = "block"；function onClick(event){    <something>.style.display = "block"; ...

问调用value + style.display函数？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问调用value + style.display函数？EN