0

我已经找到了有关此https://stackoverflow.com/a/6398848/1406888的上一个问题的答案,但它对我不起作用。我不明白,因为当我在 Firefox 开发人员的控制台中使用相同的简写时,它可以工作。

这是我正在使用的代码的简短示例

<div id="list1">
<li>pres</li>
<li>mike</li>
<li>camel</li>
<li>week</li>
</div>

<p></p>
<div id="list2">
<li>time</li>
<li class="test">era</li>
<li>people</li>
<li>life</li>
</div>

<p></p>
<div id="list3">
<li>time</li>
<li class="test">era</li>
<li>people</li>
<li>life</li>
</div>

<script type="text/javascript">

var testId = document.getElementById("list1");
testId.style.borderStyle="solid";
$("#list2").style.borderStyle="solid";

$("list3").style.borderStyle="solid";

</script>

唯一有效的是 list1 边框。其他的都失败了。有人可以纠正我。

我现在有一个工作模板。这是我的代码:

<div id="list1">
<li>pres</li>
<li>mike</li>
<li>camel</li>
<li>week</li>
</div>

<p></p>
<div id="list2">
<li>time</li>
<li class="test">era</li>
<li>people</li>
<li>life</li>
</div>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

var testId = document.getElementById("list1");
testId.style.borderStyle="solid";
//$("#list2").style.borderStyle="solid";   this does not work
$("#list2").css("border-Style","solid");   this works.
</script>

就这样我明白了。没有getElementById的替代品???我认为这是一种可互换的速记,但在我的示例中,它仅适用于 JQuery 速记的 .css 属性。

4

7 回答 7

3

有时,当我只想能够使用 $ 作为 document.getElementById 的简写而不实际需要主要 javascript 库的功能时,我将在页面中折腾:

function $(a){return document.getElementById(a);}

节省大量打字。

于 2012-06-27T05:09:18.397 回答
0

您需要有一些库来提供此快捷方式(如 jQuery)。它没有内置在核心语言或您的浏览器中。

此外,对于 jQuery,它会是$('#list3')(您可以使用各种选择器,而不仅仅是节点 ID)。

于 2012-06-27T05:06:59.967 回答
0

您需要在页面中包含 JQuery 才能使用此表示法。

于 2012-06-27T05:07:27.423 回答
0

您在此处描述的语法需要jQuery javascript 库。您必须下载并导入库,或直接链接到 HTML 中的 jQuery 代码库,然后才能使用。将以下行添加到 HTML 文件的顶部:

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
于 2012-06-27T05:09:03.737 回答
0

追加 jquery 库,$ 不在核心功能中——

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

var testId = document.getElementById("list1");
testId.style.borderStyle="solid";
$("#list2").style.borderStyle="solid";

$("list3").style.borderStyle="solid";

</script>

或者如果你对 JS 很难,那么就这样做吧----

var testId1 = document.getElementById("list1");
var testId2 = document.getElementById("list2");
var testId3 = document.getElementById("list3");
testId1.style.borderStyle="solid";
testId2.style.borderStyle="solid";
testId3.style.borderStyle="solid";
于 2012-06-27T05:09:40.123 回答
0

IMO:您需要在 jquery 中这样做

$("#list2").css("border-Style","solid")

$("#list3").css("border-Style","solid")

并确保在 jquery 中添加#Id 如果您正在访问具有 id 的元素。

于 2012-06-27T05:20:12.437 回答
0

尝试使用 jquery css方法设置边框样式。

<script type="text/javascript">
  $(document).ready(function(){
    $("#list2").css("border-style","solid");
  });
</script>
于 2012-06-27T05:22:26.350 回答