Question

我需要将文字放在另一个div中与另一个div中的Div中的<h3>中。所以这就是它的样子：

 <div id="loginModal" class="ui-dialog-content ui-widget-content" style="width: auto; min-height: 0px; height: 193.8px;"><iframe hspace="0" src="/client/en_US/cntest/search/patronlogin/https:$002f$002farrowhead.ent.sirsi.net$002fclient$002fen_US$002fcntest$002fsearch$002faccount$003fdt$003dlist" name="dialog_iframeContent610" style="width:350px;height:215px;" frameborder="0"> </iframe></div>
   <iframe hspace="0" src="/client/en_US/cntest/search/patronlogin/https:$002f$002farrowhead.ent.sirsi.net$002fclient$002fen_US$002fcntest$002fsearch$002faccount$003fdt$003dlist" name="dialog_iframeContent610" style="width:350px;height:215px;" frameborder="0"> </iframe>
#document
 <!DOCTYPE html PUBLIC "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org
 /TR/xhtml/DTD/xhtlm1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/core/default.css"><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/ctx/css/vse/css/Discovery_base.css"><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/ctx/css/format-types.css"><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/app/components/search/suggest.css"><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/core/tapestry-console.css"><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/core/t5-alerts.css"><link type="text/css" rel="stylesheet" href="/client/assets/4.5.1/core/tree.css"><meta content="Apache Tapestry Framework (version 5.3.7)" name="generator"><script src="/client/assets/4.5.1/stack/en_US/core.js" type="text/javascript"></script></head>
 <body>
 <div class="content"><center>
 <div id="changePinDiv">
 <h3 style="padding:0px;margin:0px;">Change PIN</h3>
 <form onsubmit="javascript:return Tapestry.waitForPage(event);" action="/client/en_US/cntest/changepinplainpage.changepinpanel.changepinform?&amp;t:ac=HZWS/CN/region/$N/$N" method="post" id="changePinForm">
 <div class="" style="display: none;">
 <input value="HZWS/CN/region/$N/$N" name="t:ac" type="hidden">
 <input value="NeH4a76dR7kxhv6iIEnzIQ/wdgE=:H4sIAAAAAAAAAJ2QsUoDQRCGxwMhmE6wsFcQkY2FabQxBAThkIPDOsxtxsuGvd11d87ExsqXsPEJxEqfIIWd7+AD2FhYWbg5CwVB0WZYPmbn+/lvnmFxImCrP0JTUqZMpjEOLGlXNsgp49CQFuNBHcgbrCh46FpfCnQoRyQYHQX2510hrSetClFgINErIkTJB4r0cC0nrt368az9tPLwlsBCCm1pDXurj+JFhuV0jGfY0VHZydkrU+5NHcPSp/UfKXt/TZl5KymEvC4qFYKyZnY73Dl5vX5MAKZusgkbvycI888c7fs/2qWtnDVkOIhGx9/lV/nL6v3dZT+BJIWW1CpuHw5P4aKpjzRVEczra9C8rtaHfLD95fkOfeiN7OIBAAA=" name="t:formdata" type="hidden">
 </div>
 <table><tbody><tr><td><label for="j_username" class="username">Barcode</label>:</td><td><input maxlength="30" class="user_name_input" id="j_username" name="j_username" type="TextField"><img id="j_username_icon" class="t-error-icon" alt="" src="/client/assets/4.5.1/core/spacer.gif" style="display: none;"></td></tr><tr><td colspan="2"><input value="Submit" class="loginButton" id="submit_0" name="submit_0" type="submit"></td></tr></tbody></table>
 </form>
 </div>
 </center>
 </div>
 <script type="text/javascript">Tapestry.onDOMLoaded(function() {
Tapestry.init({"formEventManager":[{"formId":"changePinForm","validate":{"submit":true,"blur":true}}]});
Tapestry.init({"activate":["j_username"],"validate":[{"j_username":[["required","Barcode is a required field."]]}]});
});
</script></body></html>

我希望我能正确加载。我需要更改文本的部分是在“div id =”changePinDiv“”中，在该div中有一个<h3>，其中包含我想要更改的文本。任何时候我尝试通过CSS来做它都不需要。

这是我试过的

#changePinDiv:before{
content:"You must have an email address assigned to your account.";
font-size:10px;
font-weight:bold;
}

我甚至尝试过

#changePinDiv.h3:before{
 content:"You must have an email address assigned to your account.";
 font-size:10px;
 font-weight:bold;
 }

不确定还能做什么。任何帮助将非常感激。

Answer 1

是否通过CSS完成？

如果没有，也许尝试使用JQuery！它在Web开发人员中相当标准化，值得学习。通过使用它，您可以将目标定位到div $('#changePinDiv').text('You must have an email address assigned to your account.')

您还可以将其与许多不同的事件（点击事件，文档准备等）联系起来

Answer 2

我不确定这是否是你想要的，但你可以使用这个jQuery：

＆＃13;

$('#changePinDiv').prepend('You must have an email address assigned to your account');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content">
    <center>
      <div id="changePinDiv">
        <h3 style="padding:0px;margin:0px;">Change PIN</h3>
        <form onsubmit="javascript:return Tapestry.waitForPage(event);" action="/client/en_US/cntest/changepinplainpage.changepinpanel.changepinform?&amp;t:ac=HZWS/CN/region/$N/$N" method="post" id="changePinForm">
          <div class="" style="display: none;">
            <input value="HZWS/CN/region/$N/$N" name="t:ac" type="hidden">
            <input value="NeH4a76dR7kxhv6iIEnzIQ/wdgE=:H4sIAAAAAAAAAJ2QsUoDQRCGxwMhmE6wsFcQkY2FabQxBAThkIPDOsxtxsuGvd11d87ExsqXsPEJxEqfIIWd7+AD2FhYWbg5CwVB0WZYPmbn+/lvnmFxImCrP0JTUqZMpjEOLGlXNsgp49CQFuNBHcgbrCh46FpfCnQoRyQYHQX2510hrSetClFgINErIkTJB4r0cC0nrt368az9tPLwlsBCCm1pDXurj+JFhuV0jGfY0VHZydkrU+5NHcPSp/UfKXt/TZl5KymEvC4qFYKyZnY73Dl5vX5MAKZusgkbvycI888c7fs/2qWtnDVkOIhGx9/lV/nL6v3dZT+BJIWW1CpuHw5P4aKpjzRVEczra9C8rtaHfLD95fkOfeiN7OIBAAA="
              name="t:formdata" type="hidden">
          </div>
          <table>
            <tbody>
              <tr>
                <td><label for="j_username" class="username">Barcode</label>:</td>
                <td><input maxlength="30" class="user_name_input" id="j_username" name="j_username" type="TextField"><img id="j_username_icon" class="t-error-icon" alt="" src="/client/assets/4.5.1/core/spacer.gif" style="display: none;"></td>
              </tr>
              <tr>
                <td colspan="2"><input value="Submit" class="loginButton" id="submit_0" name="submit_0" type="submit"></td>
              </tr>
            </tbody>
          </table>
        </form>
      </div>
    </center>
  </div>

＆＃13;

Answer 3

如果您想通过CSS将内容注入<h3>，那么样式就是：

#changePinDiv h3:before{
     content:"You must have an email address assigned to your account.";
     font-size:10px;
     font-weight:bold;
 }

但是这会产生<h3>，如下所示：

<h3>You must have an email address assigned to your account.Change Pin</h3>

自从放置此内容:after并包含空格后可能会有更多内容：

#changePinDiv h3:after{
     content:" You must have an email address assigned to your account.";
     font-size:10px;
     font-weight:bold;
 }

请参阅此fiddle

或者您可以将内容转到这样的新行：

#changePinDiv h3:after{
     content:"You must have an email address assigned to your account.";
     display: block;
     font-size:10px;
     font-weight:bold;
 }

请参阅here

<强>更新

由于它是一个iframe，如果它托管在您的域上，您可以使用jQuery执行以下操作：

$("iframe").contents().find("#changePinDiv h3").append(" You must have an email address assigned to your account.");

我需要将文本放在另一个div中的另一个Div中的Div中的<h>

3 个答案: