Question

对于一个项目，我需要获得一些网站的圆顶并解析它。我找到了YQL的解决方案。该请求似乎在此站点上运行良好。 https://developer.yahoo.com/yql/

但是当我在我的本地网站上使用以下javascript：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>BabylonJS - HexaGrid</title>
	<style>
		body, html { 
			margin:0; 
			padding: 0; 
			border: 0; 
			overflow: hidden; 
			width: 100%; 
			height: 100%; 
		}

		canvas { width: 100%; height: 100%; }
		
		#vr {
			position: absolute;
			top: 10px;
			left: 10px;
			padding: 10px 15px;
			border: 2px solid #ddd;
			background: #4587ea;
			color: #fff;
			transition: all 0.3s;
		}
		
		#vr:hover {
			transition: all 0.3s;
			background: #449fff;
			cursor: pointer;
		}	
	</style>
</head>
<body>
  <script type="text/javascript">
var url = 'https://www.brainpickings.org/2016/06/09/strange-trees/';
 $.getJSON("http://query.yahooapis.com/v1/public/yql?"+
                "q=select%20*%20from%20html%20where%20url%3D%22"+
                encodeURIComponent(url)+
                "%22&format=json'&callback=?", function(data){
          // if there is data, filter it and render it out
          if(data.results[0]){
            var test = data.results[0];
	    alert(test);
          } else {
            var errormsg = "<p>Error: can't load the page.</p>";
            alert(errormsg);
          }
      });
</script>
</body>
</html>

它只显示请求的一部分。我真的不怎么样，如果是因为yql请求很大而且没有完成，或者我缺乏一些知识来获取剩余的东西。提前感谢您的回答。

Answer 1

您的代码正在使用但缺少jQuery库，并且不会等待文档准备就绪。这是修复和工作的代码：

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>BabylonJS - HexaGrid</title>
    <style>
        body,
        html {
            margin: 0;
            padding: 0;
            border: 0;
            overflow: hidden;
            width: 100%;
            height: 100%;
        }
        
        canvas {
            width: 100%;
            height: 100%;
        }
        
        #vr {
            position: absolute;
            top: 10px;
            left: 10px;
            padding: 10px 15px;
            border: 2px solid #ddd;
            background: #4587ea;
            color: #fff;
            transition: all 0.3s;
        }
        
        #vr:hover {
            transition: all 0.3s;
            background: #449fff;
            cursor: pointer;
        }
    </style>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-rc1/jquery.min.js"></script>
</head>

<body>
    <script type="text/javascript">
    $(document).ready(function () {
    var url = 'https://www.brainpickings.org/2016/06/09/strange-trees/';
     $.getJSON("http://query.yahooapis.com/v1/public/yql?"+
                    "q=select%20*%20from%20html%20where%20url%3D%22"+
                    encodeURIComponent(url)+
                    "%22&format=json'&callback=?", function(data){
              // if there is data, filter it and render it out
              if(data.results[0]){
                var test = data.results[0];
    	    alert(test);
              } else {
                var errormsg = "<p>Error: can't load the page.</p>";
                alert(errormsg);
              }
          });
    });
    </script>
</body>

</html>

YQL请求和javascript：显示所有内容

1 个答案: