Fatal编程技术网
  • javascript/
  • Javascript 从URL捕获参数并在HTML中设置

Javascript 从URL捕获参数并在HTML中设置

javascript html

Javascript 从URL捕获参数并在HTML中设置,javascript,html,Javascript,Html,我有以下HTML文件： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Stocks</title> <link rel="styl

我有以下HTML文件：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Stocks</title>
    <link rel="stylesheet" href="https://unpkg.com/swiper/css/swiper.min.css" />
    <link rel="stylesheet" href="./style/style.css" />
  </head>
  <body>
    <!-- Slider main container -->
    <div class="swiper-container">
      <!-- Additional required wrapper -->
      <div class="swiper-wrapper">
        <!-- Slides -->

        <!-- Slide 1 -->
        <div class="swiper-slide">
          <div class="widget-container">
            <div class="tradingview-widget-container">
              <div class="tradingview-widget-container__widget"></div>
              <script
                type="text/javascript"
                src="https://s3.tradingview.com/external-embedding/embed-widget-symbol-info.js"
                async
              >

                {
                  "symbol": "BSE:INFY",
                  "width": "100%",
                  "locale": "in",
                  "colorTheme": "light",
                  "isTransparent": false
                }
              </script>
            </div>

          </div>
        </div>

    <script src="https://unpkg.com/swiper/js/swiper.min.js"></script>
    <script src="./js/index.js"></script>

    <script></script>
  </body>
</html>


股票
{
“符号”：“BSE:INFY”，
“宽度”：“100%”，
“locale”：“in”，
“颜色主题”：“光”，
“isTransparent”：错误
}
我想通过URL传递
“symbol”：“BSE:INFY”
，比如--OR

我在URL中传递的
symbol
文本，应该在HTML代码中替换--
“symbol”：“BSE:INFY”

如何通过URL传递符号、捕获符号并在上面的HTML中进行设置？

您可以使用简单的javascript API：

const queryParams = new URLSearchParams(window.location.search)
const symbol = queryParams.get('symbol')
您可以使用简单的javascript API：

const queryParams = new URLSearchParams(window.location.search)
const symbol = queryParams.get('symbol')
如果可以在PHP（服务器端）上执行，请执行以下操作

如果您使用这些链接

您可以在服务器端以get请求的形式访问symbol变量 以便您可以按如下方式使用它

            {
              "symbol": "<?php echo $_GET['symbol'];?>",
              "width": "100%",
              "locale": "in",
              "colorTheme": "light",
              "isTransparent": false
            }
如果可以在PHP（服务器端）上执行，请执行以下操作

如果您使用这些链接

您可以在服务器端以get请求的形式访问symbol变量 以便您可以按如下方式使用它

            {
              "symbol": "<?php echo $_GET['symbol'];?>",
              "width": "100%",
              "locale": "in",
              "colorTheme": "light",
              "isTransparent": false
            }
如果脚本正在从嵌入的脚本读取参数，那么就太晚了。你需要这样做

记住更改我的演示字符串

const usp = new URLSearchParams("?symbol=BSE:INFY")
到

在你的页面上


const usp=new urlsearchparms（“？symbol=BSE:APLAPOLLO”）//新urlsearchparms（location.search）；//在你的页面上
document.write（`{“symbol”：“${usp.get（“symbol”）}”，“width”：“100%”，“locale”：“in”，“colorTheme”：“light”，“isTransparent”：false}`）
如果脚本正在从嵌入的脚本读取参数，那么就太晚了。你需要这样做

记住更改我的演示字符串

const usp = new URLSearchParams("?symbol=BSE:INFY")
到

在你的页面上


const usp=new urlsearchparms（“？symbol=BSE:APLAPOLLO”）//新urlsearchparms（location.search）；//在你的页面上
document.write（`{“symbol”：“${usp.get（“symbol”）}”，“width”：“100%”，“locale”：“in”，“colorTheme”：“light”，“isTransparent”：false}`）
你能给我完整的HTML和代码的位置吗？你能给我完整的HTML和代码的位置吗？我不想使用php。如果这样，你可以使用url哈希这将是你的链接：然后在你的脚本中使用{“symbol”：window.location.hash.substring（1），“width”：“100%”，“locale”：“in”，“colorTheme”：“light”，“isTransparent”：false}@JovylleBermudez将不起作用脚本在加载时读取脚本的内部文本请再次回答，如果你不能使用PHP@dangI不想使用PHP，我会编辑它，您可以使用url哈希这将是您的链接：然后在脚本中使用{“symbol”：window.location.hash.substring（1），“width”：“100%”，“locale”：“in”，“colorTheme”：“light”，“isTransparent”：false}@JovylleBermudez不起作用脚本加载时读取脚本的内部文本请再次回答，如果您不能使用PHP@dang，我对其进行了编辑。您能给我完整的html使其起作用吗？如何动态传递符号？它总是显示Infosys now.change
const usp=new URLSearchParams（“？symbol=BSE:INFY”）
到
const usp=new URLSearchParams（location.search）
在页面上，您可以删除
const scr=document.createElement（“脚本”）这是我另一次尝试的剩余内容。你可以给我完整的html来完成这项工作吗？如何动态传递符号？它总是显示Infosys now.change
const usp=new URLSearchParams（“？symbol=BSE:INFY”）
到
const usp=new URLSearchParams（location.search）
在页面上，您可以删除
const scr=document.createElement（“脚本”）那是我另一次尝试的结果