JavaScript - 使用link参数在另一个页面的H1标签中创建文本

时间:2015-06-08 23:20:33

标签: javascript html parameters

在此示例中,我有两个页面 - 1个产品页面和1个转换页面。

在产品页面上,我会有一个指向转换页面的链接。在此链接上,我想通过参数传递产品名称。像这样:href = conversionpage.html?productName

在转换页面上,我想使用JavaScript获取产品名称参数并填充h1标签 - 因此h1标签将是这样的< h1> productName< / h1>

有意义吗?我不知道该怎么做。

提前感谢您的帮助。我有100,000个产品页面,这个例子只是为了简化问题。

2 个答案:

答案 0 :(得分:0)

以下是我认为您想要做的事情。

获取网址search参数,然后选择您需要的参数并将其放在所需标记的innerHTML中。



Loops = function(collection, fn) {
  'use strict';
  var i;

  if ((collection.item && collection.length) || collection instanceof Array || collection instanceof Element || collection.elements || collection.jquery) {
    i = collection.length;

    if (i > -1) {
      do {
        if (collection[i] !== undefined) {
          fn(i);
        }
      } while (--i >= 0);
    }
    return this;
  } else {
    throw new Error('"collection" (' + collection + ') is not valid. It should be an array or have an "item" method and a "length" property');
  }
};



GetURLParameters = function(keys) {
  'use strict';

  var pair, arr, query, parameters, queryString;

  if (location.search) {
    query = location.search.substring(1);
    parameters = query.split("&");
    queryString = {};
  }

  function createObject(key, val, i) {
    pair = parameters[i].split("=");

    if (typeof queryString[pair[key]] === "undefined") {
      queryString[pair[key]] = decodeURI(pair[val]);
    } else if (typeof queryString[pair[key]] === "string") {
      arr = [queryString[pair[key]], pair[val]];
      queryString[pair[key]] = arr;
    } else {
      queryString[pair[key]].push(pair[val]);
    }
  }

  if (parameters && keys === 1) {
    Loops(parameters, function(i) {
      createObject(1, 0, i);
    });
  } else if (parameters) {
    Loops(parameters, function(i) {
      createObject(0, 1, i);
    });
  }

  return queryString;
};

/** \/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/ **/



var params = GetURLParameters();
console.log(params);
document.getElementById('h1').innerHTML = params['parameter-name'];

<h1 id="h1"></h1>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

网址为http://example.com?productName=Walkman

<body>
    <h1 id="productName"></h1>
</body>


<script type='text/javascript'>
    // start by creating a function 
    function loadUp(){
        var str = window.location.search.replace(/(?:(\D+=))/ig, "") //get the search parameters from the url and remove everything before the "=" sign
        document.getElementById('productName').innerHTML = str //assign that string to the "innerHTML" of the h1 tag that has an id of "productName"
    };

    window.onload = loadUp; // once the page has loaded, fire off that function
</script>

这个脚本将在加载文档后执行此操作:

<body>
    <h1 id="productName">Walkman</h1>
</body>