Php 如何在Javascript中将另一个页面的ID作为变量引用

Php 如何在Javascript中将另一个页面的ID作为变量引用,php,javascript,xml,include,Php,Javascript,Xml,Include,所以,我终于在我的画廊网站上取得了一些进展,通过这里所有人的帮助,所以谢谢。现在我有最后一个,希望是非常简单的问题。首先,以下是场景: 因为我是Javascript新手,所以在深入研究jquery之前,我会尝试学习Javascript,所以我会尝试使用(我相信这个术语是)普通Javascript。在不涉及所有代码的情况下,我为我的作品制作了一个图库,在页面顶部有一个拇指滑块和一个显示所选作品(包括其他视图、说明、标题等)的字段。我现在没有使用多个数组,而是构建了一个名为“gallery/php”

所以,我终于在我的画廊网站上取得了一些进展,通过这里所有人的帮助,所以谢谢。现在我有最后一个,希望是非常简单的问题。首先,以下是场景:

因为我是Javascript新手,所以在深入研究jquery之前,我会尝试学习Javascript,所以我会尝试使用(我相信这个术语是)普通Javascript。在不涉及所有代码的情况下,我为我的作品制作了一个图库,在页面顶部有一个拇指滑块和一个显示所选作品(包括其他视图、说明、标题等)的字段。我现在没有使用多个数组,而是构建了一个名为“gallery/php”的页面,其中包含了所有将被调用到字段中的预构建div(标题为“generic”)。使用innerHTML,我进行了一个简单的调用,这样当选择了所需的缩略图时,它会按id调用相应的div,并将其写入“generic”div

很简单

问题是,我有大约40个这样的,如果我做一个php包含并将包含隐藏在一个隐藏的div中,而艺术品不显示,加载页面需要花费很长时间,这似乎是一个非常糟糕的主意。我想做的是修改我现在正在使用的函数,这样它就不用在当前页面上调用id,而是知道要引用哪个外部页面以及要拉入并填充“generic”div的div(基于id)。脚本当前看起来如下所示:

function changeDiv(art) {
        viewer = document.getElementById('generic'),
        targetInfo = document.getElementById(art);
        viewer.innerHTML = targetInfo.innerHTML; 
}
我想做的是(不考虑语法):


我所看到的唯一与我想做的类似的事情是jquery中的.load(),但我不知道如何将其转换回javascript。

好的!这是我的尝试。请注意,虽然这可能需要通过AJAX库(如jQuery)进行检查,但OP并没有要求这样做

**另外,我不知道gallery.php的设置,所以我尽了最大努力

**我也知道这很可怕,没有任何验证或其他好处,但这更多的是一个概念的证明。(针对那些实用主义程序员的跟踪程序代码)

假设您的gallery.php设置如下:

<?php
    $pull = $_GET["pull"];
    $gallery[0] = "<div>Your art work img tags here</div>";
    $gallery[1] = "<div>Some more art work</div>";
    //Pull from the changeDiv parameter in the JavaScript below.
    echo $gallery[$pull];
?>
var changeDiv = function(pull) {
    //Pull parameter indicates an array 
    //index within the gallery.php $gallery array

    var ajaxObj;

    //Our AJAX objet shall be declared
    if(window.XMLHttpRequest) {
        ajaxObj = new XMLHttpRequest();
    }
    else {
        ajaxObj = new ActiveXObject("Microsoft.XMLHTTP");
    }

    //When the ajaxObj changes it's ready 
    //state, do this stuff below
    ajaxObj.onreadystatechange = function() {
        //But only if the ready state is 
        //really ready and the status is good to go
        if(ajaxObj.readyState==4 && ajaxObj.status==200) {
            var response = this.responseText;
            document.getElementById("viewer").innerHTML=response;
        }
    }
    //Open the async connection to 
    //gallery.php and send your GET 
    //global (pull)
    ajaxObj.open("GET","gallery.php?pull="+pull,true);

    //Send it and pray
    ajaxObj.send();
}

-一些AJAX教程列表

没有任何javascript等价物,您必须使用纯javascript AJAX或jquery的AJAX或load函数才能做到这一点。感谢Sabin-我想使用什么样的javascript?您可以使用jquery。使用jquery只需几行代码就可以做到这一点。您需要对PHP脚本进行ajax调用。然后,您必须遍历脚本输出以找到targetInfo,并通过thatin的返回值设置变量。我现在正试图避免使用jquery,只是因为我想先了解基本原理,但我最终会转向jquery。克里斯托弗,我真的是个新手。。。你有没有这方面的例子,或者你可以给我指一个教程?谢谢克里斯托弗-这是远远超出我的理解,但我想我得到了一般的想法。现在进入顶部的php部分。这就是gallery.php页面的构建方式,还是我添加到digital-artwork.php页面中的内容?谢谢——老实说,我仍在尝试如何“接受”答案。它一直告诉我,如果我读对了,我在15岁之前就不能投票
var changeDiv = function(pull) {
    //Pull parameter indicates an array 
    //index within the gallery.php $gallery array

    var ajaxObj;

    //Our AJAX objet shall be declared
    if(window.XMLHttpRequest) {
        ajaxObj = new XMLHttpRequest();
    }
    else {
        ajaxObj = new ActiveXObject("Microsoft.XMLHTTP");
    }

    //When the ajaxObj changes it's ready 
    //state, do this stuff below
    ajaxObj.onreadystatechange = function() {
        //But only if the ready state is 
        //really ready and the status is good to go
        if(ajaxObj.readyState==4 && ajaxObj.status==200) {
            var response = this.responseText;
            document.getElementById("viewer").innerHTML=response;
        }
    }
    //Open the async connection to 
    //gallery.php and send your GET 
    //global (pull)
    ajaxObj.open("GET","gallery.php?pull="+pull,true);

    //Send it and pray
    ajaxObj.send();
}