Javascript 文档查询选择器(“h1类”)
我正在处理我的学校网页,我试图使用querySelectorString函数选择一个名为text的类的div中的所有标题元素,然后更改标题背景、边框和文本颜色,但下面的代码似乎不起作用Javascript 文档查询选择器(“h1类”),javascript,html,css,Javascript,Html,Css,我正在处理我的学校网页,我试图使用querySelectorString函数选择一个名为text的类的div中的所有标题元素,然后更改标题背景、边框和文本颜色,但下面的代码似乎不起作用 var test = "content.html #test" $(document).ready(function() { $.ajax( { success : function(data) { $(
var test = "content.html #test"
$(document).ready(function()
{
$.ajax(
{
success : function(data)
{
$("#content").load(test); //this works - loads <div id="test"> and all elements within it from content.html
document.querySelector(".content").style.backgroundColor = "#CCFFCC"; //this works - exists inside main html file ( $(document) )
document.querySelector(".text h1").style.backgroundColor = "#CCFFCC"; //this doesn't work - still loading default colour from css
document.querySelector(".text h1").style.color = "#003300"; //this doesn't work - still loading default colour from css
//Appropriate close tags follow...
你们知道我做错了什么吗?我引用元素的方式是否错误?或者这与我试图从一个单独的文件中动态加载此内容有关?还是完全其他的东西?正如Klaster_1所暗示的,您需要利用load的回调功能
$('#content').load(test, function() {
document.querySelector(".content").style.backgroundColor = "#CCFFCC";
document.querySelector(".text h1").style.backgroundColor = "#CCFFCC";
document.querySelector(".text h1").style.color = "#003300";
});
Klaster_1所说的异步操作的意思是,它与DOM的呈现不同步。换句话说,设置内容样式的代码将在浏览器的运行循环有机会将内容实际放到页面上之前运行。load是一个异步操作,您应该在回调中执行所有操作。有关更多详细信息,请参阅jQuery文档。他使用ajax调用的success方法来完成此操作。-编辑:哦,我忽略了负载。NM.如@Klaster_1所述:请参阅加载方法的完整回调函数。如果.text在正在加载的文档中,这可能就是问题所在。jQuery可用吗?如果是这样的话,您应该使用它,并且您应该用jQuery标记问题,以征求使用它的最佳答案。明白了,谢谢大家的帮助: